:root{
  --paper:#FDF9F6;
  --ink:#20242E;
  --ink-soft:#5B6472;
  --line-blue:#C9C3EC;
  --line-blue-strong:#7A93B0;
  --margin-red:#E6A0C4;
  --accent:#0C5BA0;
  --accent-orange:#FF8208;
  --accent-teal:#26AAB1;
  --accent-4e:#0B7A83; /* bleu-vert du logo, foncé pour rester lisible en texte blanc : couleur de la 4e */
  --accent-cm:#2E7D32; /* vert : couleur du CM1 (et de l'école dans l'administration) */
  --accent-cm2:#1B5E20;
  --accent-ce2:#558B2F; /* vert tilleul : couleur du CE2 */ /* vert émeraude foncé : couleur du CM2 */
  --accent-3e:#7A3E9D; /* violet prune, lisible en texte blanc : couleur de la 3e */
  --accent-yellow:#F8AF23;
  --white:#FFFFFF;
  --cream-box:#F3ECDD;

  --cat-N-bg:#FFD8B0; --cat-N-text:#8A4210;
  --cat-G-bg:#B9E8C4; --cat-G-text:#1F6B3A;
  --cat-D-bg:#BFDCFB; --cat-D-text:#1A4E9E;
  --cat-M-bg:#DCC9F7; --cat-M-text:#5B2F9E;
  --cat-P-bg:#FAC3DE; --cat-P-text:#9E1F5E;

  --radius:10px;
  --shadow:0 4px 22px rgba(31,58,92,.10), 0 1px 3px rgba(31,58,92,.08);
}
/* Icônes Material Symbols (Google), à la place des emoji -- rendu plus sobre et professionnel.
   Usage : <span class="gicon">nom_icone</span> (voir la liste sur fonts.google.com/icons). */
.gicon{
  font-family:'Material Symbols Outlined';
  font-weight:normal;
  font-style:normal;
  font-size:1.15em;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  vertical-align:-15%;
  -webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;overflow-x:hidden;}

/* Police OpenDyslexic (accessibilité, dyslexie) -- chargée depuis Fontsource/jsDelivr,
   licence SIL Open Font License (libre). Activée via body.font-dyslexic (bouton "Aa"
   dans la barre du haut). On cible large (body + texte courant) pour couvrir le cours,
   les exercices, les rédactions -- mais pas les formules KaTeX (rendues en police
   mathématique dédiée, changer leur police casserait l'alignement des symboles) ni le
   texte des figures SVG (polices fixées individuellement dans chaque figure). */
@font-face{
  font-family:'OpenDyslexic';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url(https://cdn.jsdelivr.net/fontsource/fonts/opendyslexic@latest/latin-400-normal.woff2) format('woff2'),
      url(https://cdn.jsdelivr.net/fontsource/fonts/opendyslexic@latest/latin-400-normal.woff) format('woff');
}
@font-face{
  font-family:'OpenDyslexic';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url(https://cdn.jsdelivr.net/fontsource/fonts/opendyslexic@latest/latin-700-normal.woff2) format('woff2'),
      url(https://cdn.jsdelivr.net/fontsource/fonts/opendyslexic@latest/latin-700-normal.woff) format('woff');
}
body.font-dyslexic,
body.font-dyslexic p, body.font-dyslexic li, body.font-dyslexic div, body.font-dyslexic span,
body.font-dyslexic td, body.font-dyslexic th, body.font-dyslexic button, body.font-dyslexic input,
body.font-dyslexic h1, body.font-dyslexic h2, body.font-dyslexic h3, body.font-dyslexic h4{
  font-family:'OpenDyslexic','Inter',sans-serif !important;
}
body.font-dyslexic .tex, body.font-dyslexic .katex, body.font-dyslexic .katex *{
  font-family:initial !important;
}
body.font-dyslexic .gicon{
  font-family:'Material Symbols Outlined' !important;
}

body{
  background:radial-gradient(circle at 15% 0%, #FFFEFC 0%, var(--paper) 55%);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Space Grotesk',sans-serif;
  letter-spacing:-0.01em;
}
code,.mono,.badge-code,.date-tag{font-family:'JetBrains Mono',monospace;}

a{color:inherit;text-decoration:none;}

/* ---------- layout shell ---------- */
.topbar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  width:100%;
  padding:14px 28px;
  background:rgba(253,249,246,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(28,43,57,.1);
}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.05rem;}
.brand-mark{width:26px;height:26px;flex:none;}
.nav-links{display:flex; gap:4px;}
.nav-links button{
  border:none;background:transparent;font-family:'Space Grotesk',sans-serif;
  font-size:.92rem; font-weight:600; color:var(--ink-soft);
  padding:8px 14px;border-radius:8px;cursor:pointer;transition:.15s;
}
.nav-links button:hover{background:rgba(28,43,57,.06); color:var(--ink);}
.nav-links button.active{background:#0D5BA3; color:var(--white);}
/* Pastille "devoirs en attente" sur le bouton "Mes devoirs" -- signalé : "les élèves sont-ils
   prévenus... qu'il y a des devoirs en attente ?". */
.nav-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 5px;margin-left:6px;
  background:#DC3545;color:#fff;border-radius:999px;
  font-size:.68rem;font-weight:700;font-family:'Space Grotesk',sans-serif;
  vertical-align:middle;
}
.nav-dropdown{position:relative;display:flex;align-items:center;}
.nav-dropdown > .nav-dropdown-trigger::after{content:'▾';font-size:.7em;margin-left:5px;opacity:.7;}
.nav-dropdown-menu{
  display:none;position:absolute;top:100%;left:0;background:var(--white);
  border:1px solid rgba(28,43,57,.12);border-radius:10px;box-shadow:var(--shadow);
  padding:6px;min-width:230px;z-index:80;margin-top:4px;
}
.nav-dropdown.open .nav-dropdown-menu{display:block;}
.nav-dropdown-menu button{display:block;width:100%;text-align:left;white-space:nowrap;border-radius:6px;}
/* Sous-menu dans un menu déroulant (Outils prof > Évaluations) : se déplie sous son intitulé. */
.nav-sub-trigger::after{content:'▸';font-size:.8em;margin-left:6px;opacity:.7;display:inline-block;transition:transform .15s;}
.nav-sub.open > .nav-sub-trigger::after{transform:rotate(90deg);}
.nav-sub-menu{display:none;margin:2px 0 4px 12px;padding-left:6px;border-left:2px solid rgba(12,91,160,.18);}
.nav-sub.open > .nav-sub-menu{display:block;}
.nav-sub-menu button .gicon{font-size:1.05em;vertical-align:-2px;margin-right:4px;opacity:.75;}
.account-menu{position:relative;flex:none;margin-left:10px;}
.account-avatar{
  width:36px;height:36px;border-radius:50%;border:1px solid rgba(28,43,57,.15);background:var(--white);
  font-size:.92rem;font-weight:700;font-family:'Space Grotesk',sans-serif;color:var(--accent);letter-spacing:.02em;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;
}
.account-avatar:hover{background:rgba(28,43,57,.06);}
#dysToggleBtn.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.account-dropdown{
  /* Sous le menu du compte (et non à 44 px du haut) : quand « Aa » et l'avatar sont empilés, le
     menu recouvrait l'avatar, qu'on ne pouvait plus cliquer pour le refermer. */
  position:absolute;right:0;top:calc(100% + 8px);width:250px;background:var(--white);border-radius:10px;
  box-shadow:var(--shadow);border:1px solid rgba(28,43,57,.1);padding:14px;z-index:50;
}
.account-dropdown input{padding:7px 9px;border-radius:6px;border:1px solid rgba(28,43,57,.2);font-family:'Inter',sans-serif;font-size:.85rem;}

/* ---------- Formulaires de connexion et d'inscription ---------- demandé : "rendre les
   formulaires d'inscription et de connexion plus sexy". Style commun (menu de connexion,
   inscription professeur, inscription Famille) : champs avec icône, bouton principal plein,
   séparateur, en-tête illustré. */
.account-dropdown:has(#accountLoggedOut:not([style*="none"])){width:300px;max-width:calc(100vw - 24px);padding:18px;border-radius:16px;box-shadow:0 18px 48px rgba(28,43,57,.18);}
.auth-head{display:flex;align-items:center;gap:12px;margin:0 0 14px;}
.auth-badge{flex:none;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#FFE3C4,#FFD0A0);color:var(--accent-orange);}
.auth-badge .gicon{font-size:24px;}
.auth-badge.big{width:56px;height:56px;border-radius:16px;margin:0 auto 10px;background:rgba(255,255,255,.18);color:#fff;}
.auth-badge.big .gicon{font-size:30px;}
.auth-title{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.15rem;line-height:1.2;color:var(--ink);}
.auth-sub{font-size:.8rem;color:var(--ink-soft);margin-top:2px;}
.auth-label{display:block;font-size:.78rem;font-weight:600;color:var(--ink-soft);margin:0 0 5px;letter-spacing:.2px;}
.auth-label-hint{font-weight:400;opacity:.85;}
.auth-label-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;}
.auth-link{font-size:.76rem;font-weight:600;color:var(--accent);text-decoration:none;}
.auth-link:hover{text-decoration:underline;}
.auth-field{position:relative;margin:0 0 12px;}
.auth-field > .gicon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:20px;color:#8A93A1;pointer-events:none;z-index:1;transition:color .15s;}
.auth-field input{display:block;width:100%;box-sizing:border-box;padding:11px 12px 11px 42px !important;border:1.5px solid #DDE2EA !important;border-radius:11px !important;
  background:#FAFBFC;font:500 .95rem 'Inter',sans-serif !important;color:var(--ink);transition:border-color .15s, box-shadow .15s, background .15s;margin:0 !important;}
.auth-field input::placeholder{color:#A4ACB8;font-weight:400;}
.auth-field input:focus{outline:none;border-color:var(--accent) !important;background:#fff;box-shadow:0 0 0 4px rgba(12,91,160,.13);}
.auth-field:focus-within > .gicon{color:var(--accent);}
.auth-field .pw-wrap > input{padding-right:42px !important;}
.btn-auth{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:4px 0 0;padding:12px 16px;border:none;border-radius:11px;cursor:pointer;
  background:linear-gradient(135deg,#1170C4,var(--accent));color:#fff;font:700 .98rem 'Space Grotesk',sans-serif;
  box-shadow:0 8px 18px rgba(12,91,160,.28);transition:transform .12s, box-shadow .12s, filter .12s;}
.btn-auth:hover{filter:brightness(1.07);transform:translateY(-1px);box-shadow:0 10px 22px rgba(12,91,160,.32);}
.btn-auth:active{transform:translateY(0);}
.btn-auth:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.btn-auth.orange{background:linear-gradient(135deg,#FF9A33,var(--accent-orange));box-shadow:0 8px 18px rgba(255,130,8,.3);}
.btn-auth-alt{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 14px;border-radius:11px;cursor:pointer;
  background:#fff;border:1.5px solid #DDE2EA;color:var(--ink);font:600 .9rem 'Space Grotesk',sans-serif;transition:.15s;margin:0 0 8px;}
.btn-auth-alt .gicon{color:var(--accent);}
.btn-auth-alt:hover{border-color:var(--accent);background:#F4F8FD;}
.auth-status{display:block;margin-top:8px;font-size:.82rem;color:var(--ink-soft);line-height:1.4;}
.auth-status:empty{display:none;}
.auth-sep{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:var(--ink-soft);font-size:.76rem;}
.auth-sep::before,.auth-sep::after{content:"";flex:1;height:1px;background:#E4E8EE;}
.auth-foot{margin:8px 0 0;font-size:.74rem;color:var(--ink-soft);line-height:1.45;text-align:center;}
.auth-modal{padding:0 !important;overflow:hidden;max-height:92vh;overflow-y:auto;}
.auth-modal-head{position:relative;text-align:center;padding:26px 22px 22px;color:#fff;
  background:radial-gradient(120% 140% at 0% 0%,#1A7AD0 0%,var(--accent) 55%,#0A4A84 100%);}
.auth-modal-head .auth-title{color:#fff;font-size:1.35rem;}
.auth-modal-head .auth-sub{color:rgba(255,255,255,.85);font-size:.85rem;}
.auth-modal-head .modal-close{position:absolute;top:10px;right:10px;color:rgba(255,255,255,.85);}
.auth-modal-head .modal-close:hover{color:#fff;}
.auth-modal-body{padding:20px 22px 22px;}
.auth-perks{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:0 0 16px;}
.auth-perks > span{display:inline-flex;align-items:center;gap:5px;background:#F1F6FC;color:var(--accent);border-radius:999px;padding:5px 11px;font-size:.78rem;font-weight:600;}
.auth-perks .gicon{font-size:16px;}
.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;}
@media (max-width:480px){ .auth-grid{grid-template-columns:1fr;} .auth-modal-head{padding:22px 16px 18px;} .auth-modal-body{padding:16px;} }

/* Bannière "nouvelle version" (app.js, checkForNewVersion) -- signalé : "après les déploiements
   je dois faire plusieurs rafraîchissements de page avant d'avoir la nouvelle version". Non
   bloquante et jamais automatique (contrairement à un rechargement forcé), pour ne jamais couper
   un élève en plein exercice. */
#newVersionBanner{
  position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:600;display:none;
  align-items:center;gap:12px;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;
  box-shadow:0 6px 20px rgba(0,0,0,.28);font-size:.85rem;max-width:90vw;
}
#newVersionBanner button{white-space:nowrap;}

.modal-overlay{position:fixed;inset:0;background:rgba(28,43,57,.5);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;}
/* niceAlert/niceConfirm/nicePrompt (app.js, niceModal) doivent toujours s'afficher AU-DESSUS de
   toute autre fenêtre déjà ouverte -- signalé : "quand on clique sur 'à reprendre', la fenêtre de
   confirmation se met derrière et on ne la voit pas". Sans ce z-index dédié, #niceModalOverlay
   retombait sur le 100 par défaut de .modal-overlay, plus bas que "Voir les rendus" (300) ou les
   panneaux de l'outil figure (400). Valeur choisie au-dessus de tous les z-index fixes utilisés
   ailleurs dans le site (max actuel : 600, la bannière de nouvelle version). */
#niceModalOverlay{z-index:700;}
.modal-card{background:var(--white);border-radius:14px;padding:22px;max-width:420px;width:100%;max-height:80vh;overflow-y:auto;box-shadow:0 24px 64px rgba(0,0,0,.28);}
.modal-close{border:none;background:transparent;font-size:1.1rem;cursor:pointer;color:var(--ink-soft);line-height:1;padding:4px;}
.modal-close:hover{color:var(--ink);}
.class-modal-item{
  display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-radius:10px;
  cursor:pointer;transition:.15s;margin-bottom:8px;border:1.5px solid rgba(28,43,57,.1);font-family:'Space Grotesk',sans-serif;font-weight:600;
}
.class-modal-item:hover{background:rgba(31,58,92,.06);border-color:rgba(31,58,92,.3);}
.class-modal-item.active{background:var(--accent);color:#fff;border-color:var(--accent);}

main{max-width:1080px;margin:0 auto;padding:40px 24px 100px;}
.breadcrumb{display:none;max-width:1080px;margin:0 auto;padding:14px 24px 0;align-items:center;flex-wrap:wrap;gap:6px;font-family:'Inter',sans-serif;font-size:.85rem;color:var(--ink-soft);}
.breadcrumb .bc-link{color:var(--accent);text-decoration:none;}
.breadcrumb .bc-link:hover{text-decoration:underline;}
.breadcrumb .bc-sep{color:var(--ink-soft);opacity:.5;}
.breadcrumb .bc-current{color:var(--ink);font-weight:600;}
.view{display:none;animation:fadein .35s ease;}
.view.active{display:block;}
@keyframes fadein{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---------- notebook (plain, no ruled lines) ---------- */
.plain-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid rgba(28,43,57,.08);}
#cahierEleveContent{padding:26px 30px;}
.nb-date-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:22px 0 10px;flex-wrap:wrap;}
.nb-date-row:first-child{margin-top:0;}
.nb-date{font-family:'JetBrains Mono',monospace;font-size:.8rem;color:var(--accent-orange);font-weight:700;}
.nb-chapitre{font-family:'Space Grotesk',sans-serif;font-size:.85rem;color:var(--accent);font-weight:700;text-align:right;}
.nb-daysep{border:none;border-top:2px dashed var(--margin-red);opacity:.6;margin:18px 0;}
.nb-accordion-section{border:1px solid rgba(28,43,57,.1);border-radius:10px;margin-bottom:10px;overflow:hidden;}
.nb-accordion-header{
  width:100%;display:flex;align-items:center;gap:10px;padding:12px 16px;border:none;cursor:pointer;
  background:var(--acc-bg,rgba(255,130,8,.05));font-family:'Space Grotesk',sans-serif;font-size:.9rem;font-weight:700;
  color:var(--acc-color,var(--accent-orange));text-align:left;
}
.nb-accordion-header:hover{filter:brightness(.97);}
.nb-accordion-chevron{transition:transform .2s ease;font-size:1.1rem;}
.nb-accordion-chevron.open{transform:rotate(180deg);}
.nb-accordion-count{margin-left:auto;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.72rem;color:var(--ink-soft);}
.nb-accordion-body{max-height:0;overflow:hidden;transition:max-height .3s ease;padding:0 20px;}
/* Signalé : "Sur smartphone dans le cahier, je n'ai pas l'image de l'exercice corrigé et pas les méthodes".
   Un jour ouvert était plafonné à 6000 px (reste de l'animation d'ouverture) : sur un téléphone, les
   colonnes étroites allongent beaucoup le contenu (ex. une interrogation avec sa correction) et tout ce
   qui venait après était coupé. Plus de plafond : le jour ouvert prend toute sa hauteur. */
.nb-accordion-body.open{max-height:none;padding:14px 20px 18px;}
@media (max-width:720px){ .nb-accordion-body{padding-left:10px;padding-right:10px;} .nb-accordion-body.open{padding:12px 10px 14px;} }
.nb-ref{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1.5px;font-weight:700;font-family:'Space Grotesk',sans-serif;font-size:1rem;margin-bottom:6px;}
.nb-ref-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.nb-remove-btn{
  flex:none;border:1px solid rgba(211,90,60,.35);background:rgba(211,90,60,.06);color:#a83c1f;
  font-family:'Space Grotesk',sans-serif;font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:20px;
  cursor:pointer;white-space:nowrap;transition:.15s;
}
.nb-remove-btn:hover{background:rgba(211,90,60,.16);}
.nb-pdf-day-btn{
  flex:none;border:1px solid rgba(28,43,57,.15);background:rgba(255,255,255,.6);color:var(--ink-soft);
  font-size:1rem;line-height:1;padding:5px 7px;border-radius:8px;cursor:pointer;transition:.15s;
}
.nb-pdf-day-btn:hover{background:#fff;color:var(--accent-orange);}
.nb-date-picker{position:relative;display:inline-flex;}
.nb-date-picker>.gicon{
  cursor:pointer;font-size:1.15rem;color:var(--ink-soft);border:1px solid rgba(28,43,57,.15);
  background:rgba(255,255,255,.6);border-radius:8px;padding:4px 6px;transition:.15s;
}
.nb-date-picker>.gicon:hover{background:#fff;color:var(--accent-orange);}
.nb-date-picker>input[type=date]{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;top:0;left:0;}
.nb-body{font-size:1rem;line-height:1.9;margin-bottom:20px;}
.nb-body b{color:var(--ink);}
.nb-figure-row{padding:0;}

/* ---------- mise en page façon manuel (sections numérotées, Définition/Règles) ---------- */
.lesson-header{
  display:flex;align-items:center;gap:14px;background:var(--accent-orange);color:#fff;
  padding:12px 20px;border-radius:10px;margin:34px 0 16px;
}
.lesson-header:first-child{margin-top:0;}
.lesson-header .num{
  width:32px;height:32px;border-radius:50%;background:#fff;color:var(--accent-orange);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Space Grotesk',sans-serif;flex:none;
}
.lesson-header h3{margin:0;font-family:'Space Grotesk',sans-serif;font-style:italic;font-size:1.15rem;font-weight:700;}
.def-badge{
  display:inline-block;background:#8A4210;color:#fff;font-weight:700;font-size:.8rem;
  padding:5px 16px;border-radius:6px;margin-bottom:10px;font-family:'Space Grotesk',sans-serif;
}
.def-box{background:var(--cream-box);border-radius:8px;padding:14px 20px;margin:0 0 18px;position:relative;}
.def-box:last-child{margin-bottom:0;}
.def-box:has(.read-aloud-btn){padding-right:46px;}
.def-box:has(.zoom-btn){padding-right:46px;}
.def-box:has(.read-aloud-btn):has(.zoom-btn){padding-right:82px;}
.read-aloud-btn{
  position:absolute;top:10px;right:10px;border:none;background:rgba(28,43,57,.08);color:var(--ink);
  border-radius:50%;width:28px;height:28px;font-size:.9rem;cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;
}
.read-aloud-btn:hover{background:rgba(28,43,57,.16);}
.read-aloud-btn.reading{background:var(--accent);color:#fff;}
.zoom-btn{
  position:absolute;top:10px;right:10px;border:none;background:rgba(28,43,57,.08);color:var(--ink);
  border-radius:50%;width:28px;height:28px;font-size:.9rem;cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;
}
.zoom-btn:hover{background:rgba(28,43,57,.16);}
.def-box:has(.read-aloud-btn) .zoom-btn{right:46px;}
.def-box:has(.learn-btn){padding-right:46px;}
.def-box:has(.learn-btn):has(.zoom-btn){padding-right:82px;}
.def-box:has(.learn-btn):has(.zoom-btn):has(.read-aloud-btn){padding-right:118px;}
/* Mode apprentissage (apprentissage.js) : bouton micro, mots cachés, barre de contrôle. */
.learn-btn{
  position:absolute;top:10px;right:10px;border:none;background:rgba(28,43,57,.08);color:var(--ink);
  border-radius:50%;width:28px;height:28px;font-size:.9rem;cursor:pointer;transition:.15s;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;
}
.learn-btn:hover{background:rgba(28,43,57,.16);}
.def-box:has(.zoom-btn) .learn-btn{right:46px;}
.def-box:has(.zoom-btn):has(.read-aloud-btn) .learn-btn{right:82px;}
.def-box.lrn-active .learn-btn{background:var(--accent);color:#fff;}
.def-box:has(.ord-btn):has(.zoom-btn){padding-right:118px;}
.def-box:has(.ord-btn):has(.zoom-btn):has(.read-aloud-btn){padding-right:154px;}
/* Jeu « Remettre dans l'ordre » (ordre.js) : bouton shaker, réserve de mots, phrase reconstruite. */
.ord-btn{position:absolute;top:10px;right:82px;border:none;background:rgba(28,43,57,.08);color:var(--ink);border-radius:50%;width:28px;height:28px;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;justify-content:center;padding:0;}
.def-box:has(.read-aloud-btn) .ord-btn{right:118px;}
.ord-btn:hover{background:rgba(28,43,57,.16);} .ord-btn:hover svg{animation:ordAgite .5s;}
.def-box.ord-active .ord-btn{background:var(--accent-orange,#E35D3A);color:#fff;}
.def-box.ord-active{outline:2px dashed rgba(227,93,58,.4);outline-offset:3px;}
.def-box.ord-gagne{outline:2px solid #1F7A4D;}
.def-box.ord-secoue{animation:ordSecoueBox .45s;}
.ord-jeu{display:flex;flex-direction:column;gap:10px;}
.ord-tete{display:flex;align-items:center;gap:8px;font-family:'Space Grotesk',sans-serif;}
.ord-shaker{display:inline-flex;color:var(--accent-orange,#E35D3A);transform-origin:50% 90%;}
.ord-shaker.agite{animation:ordAgite .7s;}
.ord-prog{margin-left:auto;font:600 .8rem 'JetBrains Mono',monospace;color:var(--ink-soft);}
.ord-phrase{min-height:46px;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;background:#fff;border:1.5px solid rgba(28,43,57,.15);border-radius:10px;line-height:1.3;}
.ord-curseur{display:inline-block;width:2px;height:1.3em;background:var(--accent,#0C5BA0);animation:ordClignote 1s steps(2) infinite;}
.ord-reserve{display:flex;flex-wrap:wrap;gap:8px;min-height:40px;justify-content:center;padding:4px 0;}
.ord-p{border:1.5px solid rgba(12,91,160,.35);background:#fff;color:var(--ink);border-radius:9px;padding:6px 11px;font:inherit;font-size:1rem;cursor:pointer;box-shadow:0 2px 0 rgba(12,91,160,.18);transition:transform .12s, background .12s;line-height:1.3;}
.ord-reserve .ord-p:hover{transform:translateY(-2px);background:#EEF4FB;}
.ord-phrase .ord-p{box-shadow:none;cursor:default;padding:3px 8px;}
.ord-phrase .ord-p:not(.ok){cursor:pointer;border-style:dashed;}
.ord-phrase .ord-p.ok{border-color:rgba(31,122,77,.45);background:#E9F5EE;color:#174F35;}
.ord-phrase .ord-p.faux{border-color:#B3261E;background:#FBE9E7;color:#8C1D18;}
.ord-p.ord-chute{animation:ordChute .55s cubic-bezier(.2,.9,.3,1.25) both;animation-delay:var(--d,0s);}
.ord-p.ord-non{animation:ordNon .45s;border-color:#B3261E;background:#FBE9E7;}
.ord-p.ord-indice-on{animation:ordIndice 1.6s;}
.ord-trou{display:inline-block;width:2.4em;height:1.25em;border-bottom:2px dotted rgba(28,43,57,.35);margin:0 2px;}
.ord-saisie{display:flex;gap:8px;justify-content:center;align-items:center;}
.ord-champ{font:inherit;font-size:1.1rem;padding:8px 12px;border:1.5px solid rgba(12,91,160,.45);border-radius:10px;width:min(320px,100%);background:#fff;}
.ord-champ:focus{outline:none;border-color:var(--accent,#0C5BA0);box-shadow:0 0 0 3px rgba(12,91,160,.15);}
.ord-champ.ord-non{animation:ordNon .45s;border-color:#B3261E;background:#FBE9E7;}
.ord-saisie .ord-ok{border:1px solid rgba(28,43,57,.18);background:#fff;border-radius:8px;padding:7px 12px;font:inherit;font-size:.9rem;cursor:pointer;display:inline-flex;align-items:center;gap:4px;}
.ord-msg{min-height:1.2em;font-size:.9rem;color:var(--ink-soft);} .ord-msg.err{color:#B3261E;font-weight:600;} .ord-msg.ok{color:#1F7A4D;font-weight:700;}
.ord-actions{display:flex;gap:6px;flex-wrap:wrap;}
.ord-actions button{border:1px solid rgba(28,43,57,.18);background:#fff;border-radius:8px;padding:5px 10px;font:inherit;font-size:.85rem;cursor:pointer;display:inline-flex;align-items:center;gap:4px;}
.ord-actions button:hover{background:rgba(12,91,160,.06);} .ord-actions button:disabled{opacity:.45;cursor:default;}
.ord-actions .ord-verif:not(:disabled){background:#F08A3C;border-color:#F08A3C;color:#fff;font-weight:700;}
.ord-niveaux{display:inline-flex;border:1px solid rgba(28,43,57,.18);border-radius:8px;overflow:hidden;margin-right:4px;}
.ord-actions .ord-niveaux button{border:none;border-radius:0;padding:5px 9px;}
.ord-actions .ord-niveaux button + button{border-left:1px solid rgba(28,43,57,.18);}
.ord-actions .ord-niveaux button.on{background:var(--accent);color:#fff;font-weight:700;}
@keyframes ordAgite{0%,100%{transform:rotate(0)}15%{transform:rotate(-22deg) translateY(-3px)}35%{transform:rotate(18deg) translateY(-5px)}55%{transform:rotate(-14deg) translateY(-2px)}75%{transform:rotate(9deg)}}
@keyframes ordChute{from{opacity:0;transform:translate(var(--x,0),var(--y,-60px)) rotate(var(--a,0)) scale(.6)}to{opacity:1;transform:none}}
@keyframes ordNon{0%,100%{transform:none}20%{transform:translateX(-7px) rotate(-3deg)}40%{transform:translateX(7px) rotate(3deg)}60%{transform:translateX(-5px)}80%{transform:translateX(4px)}}
@keyframes ordIndice{0%,100%{box-shadow:0 2px 0 rgba(12,91,160,.18)}20%,60%{box-shadow:0 0 0 4px rgba(248,175,35,.75);background:#FFF6DD}40%,80%{box-shadow:0 0 0 1px rgba(248,175,35,.4)}}
@keyframes ordSecoueBox{0%,100%{transform:none}25%{transform:rotate(-1deg) translateX(-4px)}50%{transform:rotate(1deg) translateX(4px)}75%{transform:rotate(-.5deg)}}
@keyframes ordClignote{50%{opacity:0}}
.def-box.lrn-active{outline:2px dashed rgba(12,91,160,.35);outline-offset:3px;}
.lrn-active .lrn-w:not(.lrn-ok){color:transparent !important;background:rgba(28,43,57,.13);border-radius:4px;text-decoration:none;}
.lrn-active .lrn-block:not(.lrn-ok) > *{visibility:hidden;}
.lrn-active .lrn-w{transition:color .25s, background .25s;}
.lrn-active .lrn-w.lrn-flash{background:rgba(31,122,77,.22);border-radius:4px;}
.lrn-active.lrn-peeking .lrn-w{color:inherit !important;background:none !important;}
.lrn-active.lrn-peeking .lrn-block > *{visibility:visible !important;}
.lrn-active.lrn-won{outline:2px solid #1F7A4D;}
.lrn-active.lrn-shake{animation:lrnShake .4s;}
@keyframes lrnShake{0%,100%{transform:none}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.lrn-bar{margin-top:12px;padding-top:10px;border-top:1px dashed rgba(28,43,57,.2);font-size:.9rem;}
.lrn-status{display:flex;align-items:flex-start;gap:6px;line-height:1.4;}
.lrn-status::after{content:attr(data-progress);margin-left:auto;white-space:nowrap;font-family:'JetBrains Mono',monospace;font-size:.8rem;color:var(--ink-soft);padding-left:8px;}
.lrn-mic{color:var(--ink-soft);}
.lrn-mic.on{color:#B3261E;animation:lrnPulse 1.2s infinite;}
@keyframes lrnPulse{50%{opacity:.35}}
.lrn-msg.err{color:#B3261E;font-weight:600;}
.lrn-msg.ok{color:#1F7A4D;font-weight:700;}
.lrn-timer{height:4px;background:rgba(28,43,57,.08);border-radius:2px;margin:8px 0;overflow:hidden;}
.lrn-timer > div{height:100%;width:0;background:#1F7A4D;transition:width .2s linear;}
.lrn-actions{display:flex;gap:6px;flex-wrap:wrap;}
.lrn-actions button{border:1px solid rgba(28,43,57,.18);background:#fff;border-radius:8px;padding:5px 10px;font:inherit;font-size:.85rem;cursor:pointer;display:inline-flex;align-items:center;gap:4px;touch-action:none;user-select:none;-webkit-user-select:none;}
.lrn-actions button:hover{background:rgba(12,91,160,.06);}
.lrn-active .lrn-w.lrn-next{box-shadow:inset 0 -3px 0 var(--accent);}
.lrn-active .lrn-w.lrn-next-err{box-shadow:inset 0 -3px 0 #B3261E;background:rgba(179,38,30,.16);}
.lrn-levels{display:inline-flex;border:1px solid rgba(28,43,57,.18);border-radius:8px;overflow:hidden;margin-right:4px;}
.lrn-actions .lrn-levels button{border:none;border-radius:0;padding:5px 9px;}
.lrn-actions .lrn-levels button + button{border-left:1px solid rgba(28,43,57,.18);}
.lrn-actions .lrn-levels button.on{background:var(--accent);color:#fff;font-weight:700;}
#zoomBoxOverlay{
  position:fixed;inset:0;background:rgba(20,24,32,.94);z-index:500;display:none;
  align-items:center;justify-content:center;padding:40px;cursor:zoom-out;
}
#zoomBoxOverlay .zoom-content{
  background:var(--cream-box);border-radius:16px;padding:50px 60px;max-width:1100px;max-height:85vh;
  overflow-y:auto;cursor:default;font-size:2rem;line-height:1.6;box-shadow:0 30px 80px rgba(0,0,0,.5);
}
#zoomBoxOverlay .zoom-content .we-expr{font-size:1.5rem;}
#zoomBoxOverlay .zoom-content .redaction-template{font-size:1.2rem;}
#zoomBoxOverlay .zoom-content .exo-correction-toggle{position:static;display:inline-flex;margin-top:16px;opacity:.8;}
#zoomBoxOverlay .zoom-content .step-display{font-size:1.7rem;padding:20px;}
#zoomBoxOverlay .zoom-content .step-display .step-note{font-size:1.15rem;}
#zoomBoxOverlay .zoom-content .od-tree-slot-root{font-size:1.3rem;}
#zoomBoxOverlay .zoom-content .od-tree-input{font-size:1.3rem;}
#zoomBoxOverlay .zoom-content .od-tree-op-label{font-size:1.2rem;}
#zoomBoxOverlay .zoom-content .od-tree-chip{font-size:1.2rem;}
/* Les figures SVG utilisent leur propre style="width:100%;max-width:460px" (ou une autre valeur
   fixe selon le chapitre), pensé pour la taille normale de la page -- resté tel quel, un SVG
   grossissait à peine (ou même rétrécissait) en plein écran : signalé "ce ne sont pas des vrais
   zoom [...] ça ne grossit pas". Cause : un `width:100%` dans un conteneur qui se dimensionne
   lui-même sur son contenu (.zoom-content n'a pas de largeur propre) crée une dépendance
   circulaire que le navigateur résout de façon peu fiable -- d'où aussi le "change de dimension
   à chaque étape" (la largeur résolue variait à chaque re-rendu). Une largeur FIXE et prioritaire
   ici lève l'ambiguïté : le SVG grossit vraiment (700px, contre ~460px normalement) et sa largeur
   reste stable d'une étape à l'autre ; `height:auto` garde ses proportions (déduites du viewBox). */
#zoomBoxOverlay .zoom-content svg{width:min(700px, 88vw, calc((85vh - 200px) * var(--zoom-ratio, 10))) !important;max-width:88vw !important;height:auto !important;}
/* Signalé : "Dans le chapitre 6e, gestion de données, les graphiques sont coupés en mode zoom".
   Le cadre de la figure garde en zoom sa largeur maximale de la page (style="max-width:420px"...),
   plus étroite que le SVG agrandi : la droite du graphique était coupée. En zoom, les conteneurs
   d'une figure n'ont plus de largeur maximale ; et le SVG est limité à la hauteur de l'écran
   (--zoom-ratio = largeur/hauteur du viewBox, posé par openZoomBox) pour rester entier. */
#zoomBoxOverlay .zoom-content [style*="max-width"]:has(svg),
#zoomBoxOverlay .zoom-content > .figure-wrap{max-width:none !important;}
/* Scènes du rapporteur (6e, angles) : SVG en calque absolu à 100 % de la scène, avec le rapporteur
   et le crayon posés en % par-dessus. C'est la SCÈNE qu'on agrandit (proportions 860/600), son SVG
   reste à 100 % -- sinon il débordait de la scène (overflow:hidden) et le tracé était coupé. */
#zoomBoxOverlay .zoom-content .ar-scene{width:min(860px, 85vw, calc((85vh - 280px) * 860 / 600)) !important;}
#zoomBoxOverlay .zoom-content .ar-scene > svg{width:100% !important;height:100% !important;max-width:none !important;}
#zoomBoxOverlay .zoom-close{
  position:fixed;top:24px;right:28px;border:none;background:rgba(255,255,255,.12);color:#fff;
  border-radius:50%;width:48px;height:48px;font-size:1.5rem;cursor:pointer;display:flex;
  align-items:center;justify-content:center;
}
#zoomBoxOverlay .zoom-close:hover{background:rgba(255,255,255,.22);}
.example-list{margin:0 0 20px;padding:0;list-style:none;}
.example-list li{position:relative;padding-left:20px;margin-bottom:8px;line-height:1.6;}
.example-list li::before{content:"▶";position:absolute;left:0;top:1px;color:var(--accent-orange);font-size:.7rem;}
.example-title{font-weight:700;margin:0 0 8px;font-family:'Space Grotesk',sans-serif;}
.hl{background:rgba(227,93,58,.16);border-radius:4px;padding:2px 6px;color:var(--accent-orange);font-weight:700;}
.grp-a{color:var(--accent-orange);font-weight:700;}
.grp-b{color:var(--accent);font-weight:700;}
.step-display{font-family:'Inter',sans-serif;font-size:1rem;text-align:left;padding:24px 10px 24px 30px;background:var(--white);border-radius:8px;border:1px solid rgba(28,43,57,.1);}
.step-column{display:inline-flex;flex-direction:column;gap:6px;max-width:100%;} /* un tableau large défile dans son bloc au lieu d'élargir la page */
.step-column > div{margin-bottom:6px;}
.step-column > div:last-child{margin-bottom:0;}
.step-final{font-weight:700;color:var(--accent-orange);}
.dp-sub-inner{display:inline-block;border-bottom:1.5px solid #1C1B2E;padding-bottom:2px;}
.dp-tag{font-family:'Space Grotesk',sans-serif;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;}
.we-row{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;padding:3px 0;}
.we-expr{font-family:'JetBrains Mono',monospace;font-size:1.05rem;max-width:100%;min-width:0;} /* une formule trop large défile dans son bloc (st4Long…) au lieu d'élargir la page */
.we-comment{color:var(--ink-soft);font-size:.85rem;text-align:right;flex:1;min-width:140px;}
.we-row:last-child .we-expr{font-weight:700;color:var(--accent-orange);}
.we-row:has(.tex .katex){padding:8px 0;} /* une fraction (ex. simplification en facteurs premiers, 4e) ne touche plus la ligne voisine */
.step-display .step-note{font-family:'Inter',sans-serif;font-size:.9rem;color:var(--ink-soft);margin-top:12px;}
.sub-header{display:flex;align-items:center;gap:10px;margin:24px 0 12px;}
.sub-header:first-of-type{margin-top:4px;}
.sub-header .letter{
  width:26px;height:26px;border-radius:7px;background:var(--accent-orange);color:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Space Grotesk',sans-serif;font-size:.85rem;
}
.sub-header h4{margin:0;font-family:'Space Grotesk',sans-serif;font-size:1.02rem;font-weight:700;color:var(--ink);}
.prop-badge{
  display:inline-block;background:var(--accent-teal);color:#fff;font-weight:700;font-size:.8rem;
  padding:5px 16px;border-radius:6px;margin-bottom:10px;font-family:'Space Grotesk',sans-serif;
}
.history-box{
  background:rgba(248,175,35,.09);border:1px dashed rgba(248,175,35,.5);border-radius:8px;
  padding:14px 20px;margin:26px 0 0;font-size:.9rem;line-height:1.65;
}
.history-box .history-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-style:italic;color:#8a6205;
  margin-bottom:6px;display:flex;align-items:center;gap:8px;
}
.ceb-tile{
  min-width:68px;height:68px;padding:0 12px;border-radius:14px;border:none;
  background:linear-gradient(160deg,#FFFFFF,#F3ECDD);box-shadow:0 3px 0 rgba(28,43,57,.15),0 4px 10px rgba(28,43,57,.08);
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.45rem;color:var(--ink);
  cursor:pointer;transition:transform .12s ease, box-shadow .12s ease;
  display:inline-flex;align-items:center;justify-content:center;
}
.ceb-tile:hover{transform:translateY(-3px);box-shadow:0 5px 0 rgba(28,43,57,.15),0 8px 16px rgba(28,43,57,.12);}
.ceb-tile-selected{background:linear-gradient(160deg,var(--accent-orange),#E56A00);color:#fff;box-shadow:0 3px 0 #B85400,0 4px 12px rgba(255,130,8,.35);}
.ceb-op-btn{
  width:58px;height:58px;border-radius:50%;border:none;color:#fff;font-family:'Space Grotesk',sans-serif;
  font-weight:700;font-size:1.5rem;cursor:pointer;box-shadow:0 3px 0 rgba(0,0,0,.18),0 4px 10px rgba(0,0,0,.1);
  transition:transform .12s ease;
}
.ceb-op-btn[data-op="+"]{background:linear-gradient(160deg,#3EBE7A,#1F7A4D);}
.ceb-op-btn[data-op="-"]{background:linear-gradient(160deg,#F76B6B,#C23B3B);}
.ceb-op-btn[data-op="×"]{background:linear-gradient(160deg,var(--accent),#0A4A85);}
.ceb-op-btn[data-op="÷"]{background:linear-gradient(160deg,var(--accent-teal),#1C8388);}
.ceb-op-btn:disabled{opacity:.3;cursor:not-allowed;box-shadow:none;}
.ceb-op-btn:not(:disabled):hover{transform:translateY(-2px);}
.ceb-op-selected{outline:3px solid var(--accent-yellow);outline-offset:2px;}
.ceb-stat-line{font-size:.88rem;color:var(--ink-soft);margin:3px 0;}
.ceb-game{
  background:linear-gradient(160deg,#0C5BA0,#123B6B);border-radius:20px;padding:28px 22px;
  box-shadow:0 20px 50px rgba(12,91,160,.25);
}
.ceb-target-badge{
  text-align:center;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.35);
  border-radius:16px;padding:10px 28px;
}
.ceb-game #cebHint, .ceb-game .hint{color:rgba(255,255,255,.85) !important;}
.ceb-game #cebStepsBox{background:rgba(255,255,255,.08);border-radius:12px;padding:14px 18px;}
.ceb-game #cebStepsBox .hint{color:rgba(255,255,255,.7) !important;}
.ceb-game #cebStepsBox li, .ceb-game #cebStepsBox > div > div{color:#fff;}
.ceb-game button.btn.secondary{background:rgba(255,255,255,.16);color:#fff;}
.ceb-game button.btn.secondary:hover{background:rgba(255,255,255,.26);}
.ceb-game button.btn.secondary:disabled{opacity:.35;}
.ceb-game button.btn:not(.secondary){background:#fff;color:var(--accent);}
.ceb-game button.btn:not(.secondary):hover{background:#fff;filter:brightness(.96);}
.ceb-fullscreen-btn{
  position:absolute;top:14px;right:14px;border:none;background:rgba(28,43,57,.08);color:var(--ink);
  border-radius:50%;width:34px;height:34px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  transition:.15s;
}
.ceb-fullscreen-btn:hover{background:rgba(28,43,57,.16);}
.ceb-game .ceb-fullscreen-btn{background:rgba(255,255,255,.15);color:#fff;}
.ceb-game .ceb-fullscreen-btn:hover{background:rgba(255,255,255,.28);}
.ceb-result-banner{
  background:rgba(255,255,255,.1);border-radius:14px;padding:16px 20px;margin-top:4px;
  border:1px solid rgba(255,255,255,.2);
}
.ceb-tile-frozen{cursor:default !important;}
.ceb-tile-frozen:hover{transform:none !important;box-shadow:0 3px 0 rgba(28,43,57,.15),0 4px 10px rgba(28,43,57,.08) !important;}
#cebRoot:fullscreen{background:var(--paper);display:flex;align-items:center;justify-content:center;padding:40px;}
#cebRoot:fullscreen .ceb-game{max-width:1300px;width:100%;padding:50px 40px;}
#cebRoot:fullscreen .ceb-target-badge div:last-child{font-size:4.5rem !important;}
#cebRoot:fullscreen .ceb-tile{min-width:100px;height:100px;font-size:2.2rem;border-radius:20px;}
#cebRoot:fullscreen .ceb-op-btn{width:84px;height:84px;font-size:2.2rem;}
#cebRoot:fullscreen #cebTimer{font-size:2rem !important;}
#cebRoot:fullscreen .ceb-game .hint{font-size:1.15rem;}
#cebRoot:fullscreen .ceb-game button.btn{font-size:1.15rem;padding:14px 24px;}

/* Optimisation smartphone -- demandé : "optimiser l'affichage sur smartphone". Tuiles,
   opérateurs et badge réduits pour tenir sur un écran étroit sans déborder ni se chevaucher. */
@media (max-width:480px){
  .ceb-game{padding:18px 10px;border-radius:14px;}
  .ceb-tile{min-width:48px;height:48px;font-size:1.05rem;border-radius:10px;padding:0 6px;}
  .ceb-op-btn{width:44px;height:44px;font-size:1.15rem;}
  .ceb-target-badge{padding:6px 16px;}
  .ceb-target-badge div:last-child{font-size:1.9rem !important;}
  .ceb-fullscreen-btn{width:28px;height:28px;top:8px;right:8px;}
  .ceb-fullscreen-btn .gicon{font-size:1rem;}
  #cebTimer{font-size:1.05rem !important;}
  .ceb-setup.plain-card{padding:16px 14px;max-width:100%;}
  .ceb-result-banner{padding:12px 14px;}
}

/* ---------- home ---------- */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;margin-bottom:56px;}
.hero h1{font-size:2.6rem;line-height:1.08;margin:0 0 14px;}
.hero p.lede{color:var(--ink-soft);font-size:1.05rem;line-height:1.55;max-width:46ch;margin:0 0 26px;}
.eyebrow{
  display:inline-block;font-family:'JetBrains Mono',monospace;font-size:.72rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--accent);
  background:rgba(31,58,92,.08); padding:4px 10px;border-radius:20px;margin-bottom:14px;
}
.hero-figure{aspect-ratio:1/1; display:flex;align-items:center;justify-content:center;}

.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:10px;}
@media (max-width:1100px){ .level-grid{grid-template-columns:repeat(2,1fr);} }
/* Pastille « Nouveau » d'un niveau qui vient d'ouvrir (4e, build 786). */
.level-card .lvl-new{position:absolute;top:14px;right:14px;z-index:1;font-family:'Space Grotesk',sans-serif;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;background:var(--accent-4e);padding:3px 9px;border-radius:999px;}
.level-card{
  padding:26px 24px;border-radius:var(--radius);cursor:pointer;
  border:1px solid rgba(28,43,57,.1); background:var(--white);
  box-shadow:var(--shadow); transition:.18s; position:relative; overflow:hidden;
}
.level-card:hover{transform:translateY(-3px); box-shadow:0 8px 24px rgba(28,43,57,.14);}
.level-card .lvl-num{font-family:'Space Grotesk',sans-serif;font-size:2.6rem;font-weight:700;line-height:1;}
.level-card .lvl-name{color:var(--ink-soft);font-size:.95rem;margin-top:4px;}
.level-card .lvl-count{margin-top:14px;font-size:.82rem;color:var(--ink-soft);font-family:'JetBrains Mono',monospace;}
.level-card.n6::before, .level-card.n5::before, .level-card.n4::before, .level-card.n3::before{
  content:""; position:absolute; right:-30px; top:-30px; width:120px;height:120px;border-radius:50%;
}
.level-card.n6::before{background:radial-gradient(circle, rgba(255,130,8,.16), transparent 70%);}
.level-card.n5::before{background:radial-gradient(circle, rgba(12,91,160,.16), transparent 70%);}
.level-card.n6{border-top:3px solid var(--accent-orange);}
.level-card.n5{border-top:3px solid var(--accent);}
.level-card.n4{border-top:3px solid var(--accent-4e);}
.level-card.n3{border-top:3px solid var(--accent-3e);}
.level-card.n3 .lvl-new{background:var(--accent-3e);}
.level-card.n4::before{background:radial-gradient(circle, rgba(11,122,131,.16), transparent 70%);}
.level-card.n3::before{background:radial-gradient(circle, rgba(122,62,157,.16), transparent 70%);}

.section-title{display:flex;align-items:baseline;gap:10px;margin:44px 0 16px;}
/* Bandeau « Vous êtes parent ? » de l'accueil (offre Famille, famille.js). */
.fam-home{display:flex;align-items:center;gap:16px;margin:26px 0 0;padding:16px 20px;border-radius:16px;text-decoration:none;color:var(--ink);
  background:linear-gradient(120deg,#FFF1E0 0%,#FFE2C2 55%,#FFD3A6 100%);border:1px solid rgba(255,130,8,.25);box-shadow:0 8px 22px rgba(255,130,8,.12);transition:transform .15s, box-shadow .15s;}
.fam-home:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(255,130,8,.2);}
.fam-home-ico{flex:none;width:52px;height:52px;border-radius:14px;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--accent-orange);box-shadow:0 4px 10px rgba(255,130,8,.18);}
.fam-home-ico .gicon{font-size:30px;}
.fam-home-txt{flex:1;display:flex;flex-direction:column;gap:3px;font-size:.92rem;line-height:1.45;}
.fam-home-txt b{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;}
.fam-home-cta{flex:none;display:inline-flex;align-items:center;gap:6px;background:var(--accent-orange);color:#fff;border-radius:999px;padding:10px 18px;font:700 .92rem 'Space Grotesk',sans-serif;white-space:nowrap;}
@media (max-width:700px){ .fam-home{flex-wrap:wrap;} .fam-home-cta{width:100%;justify-content:center;} }
.section-title h2{font-size:1.3rem;margin:0;}
.section-title .count{color:var(--ink-soft);font-size:.85rem;font-family:'JetBrains Mono',monospace;}

.mini-links{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px;}
.mini-link{
  padding:18px;border-radius:var(--radius);background:var(--white);border:1px solid rgba(28,43,57,.1);
  box-shadow:var(--shadow);cursor:pointer;transition:.15s;
}
.mini-link:hover{transform:translateY(-2px);}
.mini-link .t{font-weight:600;font-family:'Space Grotesk',sans-serif;}
.mini-link .d{color:var(--ink-soft);font-size:.85rem;margin-top:4px;}

/* ---------- niveau view ---------- */
.niveau-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:22px;}
.back-btn{
  display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--ink-soft);
  cursor:pointer;padding:6px 4px;
}
.back-btn:hover{color:var(--ink);}
.view-toggle{display:flex;background:rgba(28,43,57,.06);border-radius:8px;padding:3px;}
.view-toggle button{border:none;background:transparent;padding:7px 14px;border-radius:6px;font-size:.82rem;font-weight:600;cursor:pointer;font-family:'Space Grotesk',sans-serif;color:var(--ink-soft);}
.view-toggle button.active{background:var(--white);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12);}

.cat-block{margin-bottom:30px;}
.cat-label{
  display:inline-flex;align-items:center;gap:8px;font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:.95rem;margin-bottom:12px;padding:5px 12px 5px 5px;border-radius:20px;
}
.cat-dot{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-size:.68rem;font-weight:700;}

.chap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;}
.chap-card{
  background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);
  padding:16px;cursor:pointer;transition:.15s;border-left:5px solid transparent;position:relative;
}
.chap-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.chap-card .code{font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--ink-soft);}
.chap-card .titre{font-family:'Space Grotesk',sans-serif;font-weight:600;margin:6px 0 10px;line-height:1.25;font-size:.98rem;}
.chap-card .meta{display:flex;justify-content:space-between;font-size:.74rem;color:var(--ink-soft);}
.chap-card .status{
  position:absolute; top:12px; right:12px; font-size:.65rem; padding:2px 7px; border-radius:20px;
  font-family:'JetBrains Mono',monospace; background:rgba(28,43,57,.07); color:var(--ink-soft);
}
.chap-card.ready .status{background:rgba(45,106,79,.15); color:#2C5A2E;}
.chap-card.locked{opacity:.55;cursor:pointer;filter:grayscale(.4);}
.chap-card.locked:hover{transform:none;box-shadow:none;}
.chap-card .status.lock-status{background:rgba(28,43,57,.12);color:var(--ink-soft);}
/* Libellé long (« hors du niveau de ta classe ») : sur sa propre ligne, il ne chevauche plus le code du chapitre. */
.chap-card .status.lock-status{position:static;display:inline-flex;align-items:center;gap:3px;margin:0 0 6px;}
.chap-card .status.lock-status .gicon{font-size:.8rem;}

/* timeline view */
.timeline{position:relative; padding-left:20px; border-left:2px solid rgba(28,43,57,.12);}
.tl-period{margin-bottom:26px;}
.tl-period-label{font-family:'JetBrains Mono',monospace; font-size:.75rem; color:var(--ink-soft); margin-bottom:10px;}
.tl-vac{
  font-size:.78rem; color:var(--accent-orange); font-weight:600; margin:14px 0 14px -20px; padding-left:20px;
  border-left:2px dashed var(--accent-orange);
}
.tl-item{
  display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid rgba(28,43,57,.1);
  border-radius:8px; padding:10px 14px; margin-bottom:8px; cursor:pointer; transition:.15s;
}
.tl-item:hover{transform:translateX(3px);}
.tl-item .dot{width:10px;height:10px;border-radius:50%;flex:none;}
.tl-item .titre{font-weight:600;font-size:.9rem;flex:1;}
.tl-item .dates{font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--ink-soft);white-space:nowrap;}
.tl-item.tl-done{background:rgba(31,107,58,.05);border-color:rgba(31,107,58,.25);}
.tl-item.locked{opacity:.55;filter:grayscale(.4);}
.tl-item.locked:hover{transform:none;}
.tl-content-badge.lock-status{background:rgba(28,43,57,.12);color:var(--ink-soft);}
.tl-content-badge{font-size:.68rem;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap;flex:none;font-family:'Space Grotesk',sans-serif;}
.tl-content-badge.ready{background:rgba(38,170,177,.15);color:var(--accent-teal);}
.tl-content-badge.missing{background:rgba(28,43,57,.06);color:var(--ink-soft);}
.tl-check{
  flex:none;width:20px;height:20px;border-radius:50%;background:#1F6B3A;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;
}

/* ---------- chapitre view ---------- */
.chap-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px;margin-bottom:8px;}
.chap-head h1{font-size:1.9rem;margin:6px 0 6px;}
.chap-tags{display:flex;gap:8px;align-items:center;}
.tag{font-family:'JetBrains Mono',monospace;font-size:.72rem;padding:3px 9px;border-radius:20px;}

.tabs{display:flex;gap:6px;margin:26px 0 20px;border-bottom:1px solid rgba(28,43,57,.12);}
.tab-btn{
  border:none;background:transparent;padding:10px 16px;font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:.9rem;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;
}
.tab-btn.active{color:var(--ink);border-bottom-color:var(--accent);}
.tab-panel{display:none;}
.tab-panel.active{display:block;animation:fadein .3s ease;}
.sup-tab-btn{
  border:none;background:transparent;padding:10px 16px;font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:.9rem;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;
}
.sup-tab-btn.active{color:var(--ink);border-bottom-color:var(--accent);}
.sup-tab-panel{display:none;}
.sup-tab-panel.active{display:block;animation:fadein .3s ease;}

.tool-group-tabs{border-bottom:1px solid rgba(28,43,57,.1);}
.tool-tab-btn{
  border:none;background:transparent;padding:8px 14px;font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:.85rem;color:var(--ink-soft);cursor:pointer;border-radius:8px 8px 0 0;
}
.tool-tab-btn.active{color:#fff;background:var(--accent);}

.tool-icon-btn{
  border:1px solid rgba(28,43,57,.12); background:#fff; border-radius:10px;
  width:44px; height:44px; font-size:1.3rem; cursor:pointer; display:inline-flex;
  align-items:center; justify-content:center; transition:background .15s, border-color .15s;
  color:var(--ink-soft);
}
/* Outils IA : visibles seulement si l'utilisateur y a droit (classes posées sur <body> par
   ia-compte.js d'après my_ai_access -- le relais ai-proxy revérifie tout côté serveur). */
body:not(.ai-quiz) .needs-ai-quiz, body:not(.ai-figure) .needs-ai-figure, body:not(.ai-tableau) .needs-ai-tableau,
body:not(.ai-eval) .needs-ai-eval, body:not(.ai-geoanim) .needs-ai-geoanim{display:none !important;}
/* Page « Intelligence artificielle » */
.ia-card{margin-bottom:16px;}
.ia-h{font-family:'Space Grotesk',sans-serif;font-size:1.02rem;}
.ia-sub{font-family:'Space Grotesk',sans-serif;font-size:.95rem;margin:16px 0 6px;}
.ia-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.ia-tile{border:1px solid rgba(28,43,57,.12);border-radius:10px;padding:10px 14px;background:#fff;}
.ia-tile-v{font-family:'Space Grotesk',sans-serif;font-size:1.4rem;font-weight:700;}
.ia-tile-l{font-size:.82rem;color:var(--ink-soft);}
.ia-table td,.ia-table th{white-space:nowrap;}
.tool-icon-btn:hover{background:rgba(28,43,57,.05); border-color:rgba(28,43,57,.25); color:var(--ink);}

.placeholder-box{
  border:1.5px dashed rgba(28,43,57,.25); border-radius:var(--radius); padding:34px; text-align:center;
  color:var(--ink-soft); background:rgba(28,43,57,.02);
}
.placeholder-box strong{display:block;color:var(--ink);font-family:'Space Grotesk',sans-serif;margin-bottom:6px;font-size:1.05rem;}

.pt-cross{stroke-linecap:square;}
.pt-tick{stroke-linecap:square;}
.vertex-handle{fill:transparent;stroke:none;transition:.12s;}
.vertex-handle:hover, .vertex-handle.dragging{fill:rgba(31,58,92,.14);stroke:#1F3A5C;stroke-width:1.2;}
.redaction-note{
  background:rgba(227,93,58,.08);border:1px solid rgba(227,93,58,.25);
  border-radius:8px;padding:10px 14px;font-size:.82rem;line-height:1.6;color:#8A2E1C;margin-bottom:16px;
  position:relative;
}
.redaction-note:has(.zoom-btn){padding-right:46px;}
.figure-wrap{
  background:var(--white); border:1px solid rgba(28,43,57,.1); border-radius:var(--radius); padding:18px;
  box-shadow:var(--shadow); margin-bottom:18px; position:relative;
}
.figure-wrap:has(.zoom-btn){padding-right:52px;}
.figure-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center;}
button.btn{
  font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:.85rem; border:none; cursor:pointer;
  padding:9px 16px; border-radius:8px; background:var(--accent); color:#fff; transition:.15s;
}
button.btn:hover{filter:brightness(1.08);}
button.btn.secondary{background:rgba(28,43,57,.08); color:var(--ink);}
button.btn.orange{background:var(--accent-orange);}
button.btn:disabled{opacity:.4;cursor:not-allowed;}
.hint{font-size:.78rem;color:var(--ink-soft);margin-top:8px;}

/* Dominance de couleur par niveau (issue du logo) : orange pour la 6e, bleu pour la 5e, bleu-vert pour la 4e. */
#view-chapitre.lvl-6e .tab-btn.active{border-bottom-color:var(--accent-orange);}
#view-chapitre.lvl-6e button.btn:not(.secondary):not(.orange){background:var(--accent-orange);}
#view-chapitre.lvl-5e .tab-btn.active{border-bottom-color:var(--accent);}
#view-chapitre.lvl-5e button.btn:not(.secondary):not(.orange){background:var(--accent);}
#view-chapitre.lvl-5e .lesson-header{background:var(--accent);}
#view-chapitre.lvl-5e .lesson-header .num{color:var(--accent);}
#view-chapitre.lvl-5e .sub-header .letter{background:var(--accent);}
#view-chapitre.lvl-4e .tab-btn.active{border-bottom-color:var(--accent-4e);}
#view-chapitre.lvl-3e .tab-btn.active{border-bottom-color:var(--accent-3e);}
#view-chapitre.lvl-4e button.btn:not(.secondary):not(.orange){background:var(--accent-4e);}
#view-chapitre.lvl-3e button.btn:not(.secondary):not(.orange){background:var(--accent-3e);}
#view-chapitre.lvl-4e .lesson-header{background:var(--accent-4e);}
#view-chapitre.lvl-3e .lesson-header{background:var(--accent-3e);}
#view-chapitre.lvl-4e .lesson-header .num{color:var(--accent-4e);}
#view-chapitre.lvl-3e .lesson-header .num{color:var(--accent-3e);}
#view-chapitre.lvl-4e .sub-header .letter{background:var(--accent-4e);}
#view-chapitre.lvl-3e .sub-header .letter{background:var(--accent-3e);}

.step-list{margin-top:14px;}
.step-item{
  display:flex;gap:12px;padding:10px 0;border-bottom:1px solid rgba(28,43,57,.08);opacity:.35;transition:.25s;
}
.step-item.done{opacity:1;}
.step-num{
  width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-size:.72rem;
  display:flex;align-items:center;justify-content:center;flex:none;font-family:'JetBrains Mono',monospace;
}
.step-item.done .step-num{background:var(--accent);}

.redaction-block{background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);padding:22px;margin-bottom:16px;box-shadow:var(--shadow);}
.redaction-block h3{margin:0 0 10px;font-size:1.02rem;}
.redaction-template{
  background:rgba(31,58,92,.06); border-left:3px solid var(--accent); padding:12px 16px; border-radius:6px;
  font-size:.9rem; line-height:1.65; margin:10px 0;
}
.redaction-template .fill{color:var(--accent-orange);font-weight:600;}
.exo-card{border:1px solid rgba(28,43,57,.1);border-radius:8px;padding:16px;margin-top:12px;position:relative;padding-bottom:34px;}
.exo-card:has(.zoom-btn){padding-right:46px;}
.exo-card .num{font-family:'JetBrains Mono',monospace;color:var(--ink-soft);font-size:.78rem;}
.exo-correction-toggle{
  position:absolute;bottom:6px;right:8px;border:none;background:none;
  color:var(--ink-soft);cursor:pointer;padding:4px;opacity:.55;transition:.15s;line-height:1;
}
.exo-correction-toggle:hover{opacity:1;}
.exo-correction-toggle .gicon{font-size:1.3rem;display:block;transition:transform .2s;}
.exo-correction-toggle.open .gicon{transform:rotate(180deg);}
.exo-correction{
  display:none;margin-top:14px;padding:14px;background:#F2F3F5;border-radius:8px;
}
.exo-correction.open{display:block;animation:fadein .25s ease;}
.od-tree-chip{
  border:2px dashed var(--accent);background:rgba(12,91,160,.06);color:var(--accent);
  border-radius:8px;padding:8px 14px;font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:.85rem;cursor:pointer;user-select:none;transition:.15s;
}
.od-tree-chip:hover{background:rgba(12,91,160,.12);}
.od-tree-chip-selected{
  border-style:solid;background:var(--accent);color:#fff;box-shadow:0 0 0 3px rgba(12,91,160,.25);
}
.od-tree-zone{
  min-height:60px;border:2px dashed rgba(28,43,57,.2);border-radius:8px;padding:16px;
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;background:var(--white);
}
.od-tree-slot{
  display:inline-flex;align-items:center;gap:6px;border:1.5px dashed rgba(28,43,57,.25);
  border-radius:6px;padding:4px 8px;background:#F2F3F5;cursor:pointer;
}
.od-tree-slot-root{color:var(--ink-soft);font-size:.9rem;padding:10px 16px;}
.od-tree-slot.od-tree-filled{
  border-style:solid;border-color:var(--accent);background:rgba(12,91,160,.08);font-weight:700;
}
.od-tree-input{width:70px;border:none;background:transparent;font-family:'JetBrains Mono',monospace;font-size:.95rem;}
.od-tree-op-card{
  display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px;border:1.5px solid var(--accent-orange);
  border-radius:8px;padding:8px 10px;background:rgba(255,130,8,.06);
}
.od-tree-op-label{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.85rem;color:var(--ink);}
.od-tree-clear{
  border:none;background:none;color:var(--ink-soft);cursor:pointer;padding:2px;opacity:.6;
  display:inline-flex;align-items:center;
}
.od-tree-clear:hover{opacity:1;color:#a83c1f;}

.quiz-shell{background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);}
.api-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0;}
.api-row input{
  flex:1;min-width:220px;padding:10px 12px;border-radius:8px;border:1px solid rgba(28,43,57,.2);font-family:'JetBrains Mono',monospace;font-size:.85rem;
}
.quiz-q{border-top:1px solid rgba(28,43,57,.1);padding:16px 0;}
.quiz-num{font:600 .72rem 'Space Grotesk',sans-serif;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:4px;}
.quiz-opt{
  display:block;width:100%;text-align:left;padding:10px 14px;margin:6px 0;border-radius:8px;
  border:1px solid rgba(28,43,57,.15);background:var(--paper);cursor:pointer;font-family:'Inter',sans-serif;font-size:.9rem;
}
.quiz-opt.correct{background:rgba(45,106,79,.18);border-color:#2C5A2E;}
.quiz-opt.wrong{background:rgba(211,90,60,.15);border-color:#a83c1f;}

/* ---------- automatismes ---------- */
.cm-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:22px;}
.cm-group-header{
  grid-column:1/-1;display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;
  font-weight:700;font-size:.95rem;margin:16px 0 2px;
}
.cm-group-header:first-child{margin-top:0;}
.cm-group-symbol{
  display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;
  color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:.95rem;flex:none;
}
.cm-chip{
  background:linear-gradient(160deg,var(--white),var(--cm-accent-bg,rgba(28,43,57,.03)));
  border:1px solid rgba(28,43,57,.1);border-left:4px solid var(--cm-accent,rgba(28,43,57,.15));
  border-radius:10px;padding:11px 13px;cursor:pointer;font-size:.83rem;font-weight:600;
  transition:transform .12s ease, box-shadow .12s ease;position:relative;
  box-shadow:0 1px 3px rgba(28,43,57,.06);
}
.cm-chip:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(28,43,57,.14);}
.cm-chip.active{background:var(--cm-accent,var(--accent));color:#fff;}
.cm-chip .seq{font-family:'JetBrains Mono',monospace;font-size:.68rem;opacity:.6;font-weight:400;margin-top:2px;}
.cm-chip-badge{
  position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:.75rem;
}
.cm-chip-badge.cm-badge-done{background:#C77D1E;}
.cm-chip-badge.cm-badge-perfect{background:#1F7A4D;}
.cm-chip-records{margin-top:8px;padding-top:6px;border-top:1px dashed rgba(28,43,57,.15);font-family:'JetBrains Mono',monospace;font-size:.7rem;color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:8px;}
.cm-timer{font-family:'JetBrains Mono',monospace;font-size:1rem;font-weight:700;color:var(--accent);}
.pgame-board{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:380px;margin:0 auto;}
.pgame-col{display:flex;flex-direction:column;gap:8px;}
.pgame-card{
  background:var(--white);border:1px solid rgba(28,43,57,.16);border-radius:8px;padding:10px 12px;
  text-align:center;cursor:pointer;font-size:.9rem;transition:.15s;user-select:none;
}
.pgame-card:hover{border-color:var(--accent);}
.pgame-card.selected{border-color:var(--accent);background:rgba(31,58,92,.08);}
.pgame-card.matched{background:rgba(31,107,58,.1);border-color:#1F6B3A;color:#1F6B3A;font-weight:700;cursor:default;}
.pgame-card.wrong{border-color:#9E1F5E;background:rgba(158,31,94,.08);}
.cm-legend-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.cm-legend-dot.cm-legend-done{background:#C77D1E;}
.cm-legend-dot.cm-legend-perfect{background:#1F6B3A;}
.cm-records{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.cm-record-box{background:var(--paper);border-radius:8px;padding:8px 14px;font-size:.85rem;flex:1;min-width:130px;text-align:center;}
.cm-record-box .cm-record-val{display:block;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:1.05rem;margin-top:2px;}
.cm-record-box.cm-record-mine{background:rgba(31,58,92,.08);}
.cm-workspace{background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);}
.cm-q-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin:18px 0;}
.cm-q{background:var(--paper);border-radius:8px;padding:14px;font-family:'JetBrains Mono',monospace;font-size:.95rem;}
.cm-q input{width:64px;padding:4px 6px;border-radius:5px;border:1px solid rgba(28,43,57,.25);font-family:'JetBrains Mono',monospace;}
.cm-q .cm-q-answer{display:inline-block;min-width:44px;padding:4px 6px;border-radius:5px;border:1px solid rgba(28,43,57,.25);font-weight:700;text-align:center;}
.cm-q.ok input,.cm-q.ok .cm-q-answer{background:rgba(45,106,79,.15);border-color:#2C5A2E;}
.cm-q.ko input,.cm-q.ko .cm-q-answer{background:rgba(211,90,60,.12);border-color:#a83c1f;}

/* ---------- Automatismes : parcours progressif (une question à la fois) ----------
   signalé : "montrer un exemple avant de démarrer", "afficher les calculs progressivement",
   "un pavé numérique tactile pour les Chromebooks" (ni souris, ni pavé physique fiable). */
.cm-intro{text-align:center;padding:6px 0 10px;}
.cm-example-box{
  background:var(--paper);border-radius:10px;border-left:4px solid var(--ink-soft);padding:16px 20px;margin:14px auto;
  max-width:340px;font-family:'JetBrains Mono',monospace;font-size:1.1rem;box-shadow:0 2px 8px rgba(28,43,57,.08);
}
.cm-example-label{font-family:'Space Grotesk',sans-serif;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:6px;}
.cm-progress{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:.9rem;color:#fff;opacity:.85;text-align:center;margin:0 0 4px;}

/* Carte de jeu (question + résultat) au style dégradé sombre, teintée selon le groupe de la
   séquence (--cm-accent/--cm-accent-dark, voir cmGameStyle) -- demandé : "rendre la fenêtre
   plus sexy, un peu comme Objectif Nombre". Reprend le principe de .ceb-game. */
.cm-game{
  background:linear-gradient(160deg,var(--cm-accent,var(--accent)),var(--cm-accent-dark,#123B6B));
  border-radius:20px;padding:26px 22px;box-shadow:0 20px 50px rgba(12,43,80,.25);
}
.cm-game .cm-timer{color:#fff;}
.cm-game .hint{color:rgba(255,255,255,.85);}
.cm-game button.btn.secondary{background:rgba(255,255,255,.16);color:#fff;}
.cm-game button.btn.secondary:hover{background:rgba(255,255,255,.26);}
.cm-game button.btn:not(.secondary){background:#fff;color:var(--ink);}
.cm-game button.btn:not(.secondary):hover{background:#fff;filter:brightness(.96);}
.cm-question-box{
  background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.35);border-radius:16px;
  padding:30px 18px;margin:10px auto 22px;max-width:460px;text-align:center;
  font-family:'JetBrains Mono',monospace;font-size:1.5rem;color:#fff;
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;
}
.cm-question-box input{
  width:130px;text-align:center;padding:8px 10px;margin:0 4px;border-radius:10px;
  border:none;font-family:'JetBrains Mono',monospace;font-size:1.4rem;font-weight:700;
  background:#fff;color:var(--ink);
}
.cm-question-box input:focus{outline:3px solid rgba(255,255,255,.5);}
.cm-keypad{display:grid;grid-template-columns:repeat(3,72px);gap:12px;justify-content:center;margin:18px auto;}
.cm-keypad button{
  width:72px;height:64px;border-radius:14px;border:none;
  background:linear-gradient(160deg,#FFFFFF,#F3ECDD);box-shadow:0 3px 0 rgba(12,20,30,.3),0 4px 10px rgba(0,0,0,.15);
  font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:700;
  color:var(--ink);cursor:pointer;transition:transform .1s ease, box-shadow .1s ease;
}
.cm-keypad button:hover{transform:translateY(-2px);box-shadow:0 5px 0 rgba(12,20,30,.3),0 8px 16px rgba(0,0,0,.18);}
.cm-keypad button:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(12,20,30,.3),0 2px 6px rgba(0,0,0,.15);}
.cm-keypad button.cm-key-erase{color:#fff;background:linear-gradient(160deg,#F76B6B,#C23B3B);box-shadow:0 3px 0 #8C2626,0 4px 10px rgba(0,0,0,.15);}
.cm-game .cm-q{background:rgba(255,255,255,.12);color:#fff;}
.cm-game .cm-q input,.cm-game .cm-q .cm-q-answer{border-color:rgba(255,255,255,.4);color:#fff;}
.cm-game .cm-q.ok input,.cm-game .cm-q.ok .cm-q-answer{background:rgba(62,190,122,.3);border-color:#3EBE7A;}
.cm-game .cm-q.ko input,.cm-game .cm-q.ko .cm-q-answer{background:rgba(247,107,107,.25);border-color:#F76B6B;}
.cm-game .cm-record-box{background:rgba(255,255,255,.12);color:#fff;}
.cm-game .cm-record-box.cm-record-mine{background:rgba(255,255,255,.22);}

@media (max-width:480px){
  .cm-game{padding:18px 12px;border-radius:14px;}
  .cm-question-box{padding:20px 12px;font-size:1.2rem;}
  .cm-question-box input{width:100px;font-size:1.15rem;}
  .cm-keypad{grid-template-columns:repeat(3,58px);gap:8px;}
  .cm-keypad button{width:58px;height:52px;font-size:1.2rem;border-radius:12px;}
}

footer{text-align:center;color:var(--ink-soft);font-size:.78rem;padding:30px;}
footer a{text-decoration:underline;text-underline-offset:2px;}
footer a:hover{color:var(--accent);}

/* ---------- print export ---------- */
@media print{
  .topbar, .tabs, .back-btn, .figure-toolbar, footer, .view-toggle, .nav-links,
  .chap-tags, #correctionForm, .correction-toolbar, .cahier-list-actions { display:none !important; }
  .learn-btn, .lrn-bar, .ord-btn, .ord-jeu{display:none !important;}
  .ord-cache{display:block !important;}
  .lrn-active .lrn-w{color:inherit !important;background:none !important;}
  .lrn-active .lrn-block > *{visibility:visible !important;}
  main{padding:0;max-width:100%;}
  body{background:#fff;}
  .figure-wrap, .redaction-block{box-shadow:none;border:1px solid #ccc;break-inside:avoid;}
  .cahier-entry{break-inside:avoid;border:none;padding:0 0 18px;}
  /* "Chapitre N" en haut à gauche de CHAQUE page imprimée -- position:fixed est répété par
     le navigateur sur chaque page, contrairement à un élément normal. */
  #printChapHeader{
    display:block !important; position:fixed; top:0; left:0; text-align:left;
    font-family:'Space Grotesk',sans-serif; font-size:9pt; line-height:1.35; color:#555;
  }
  /* Le titre normal est remplacé par "CODE - TITRE" en majuscules, en gros (signalé :
     "écrire en gros N1 - NOMBRES ENTIERS comme titre et supprimer N1 Nombres entiers en
     dessous de Chapitre 1"). */
  #chap-title{ display:none !important; }
  #printChapBigTitle{
    display:block !important; font-family:'Space Grotesk',sans-serif; font-size:22pt;
    font-weight:700; margin:0 0 6px;
  }
  #view-chapitre{ margin-top:34px; } /* évite que le contenu chevauche l'en-tête fixe */
  /* Pagination "page / total" en bas de chaque page -- @page/marges CSS (prise en charge
     correcte par Chrome), signalé : "en bas de page, la pagination 1/4 par exemple". */
  @page{
    margin:20mm 15mm 15mm 15mm;
    @bottom-center{ content: counter(page) " / " counter(pages); font-size:9pt; color:#555; }
  }
}

/* ---------- outil prof : correction projetée ---------- */
.tool-shell{background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;margin-bottom:20px;}
/* Tableaux de Supervision (comptes, résultats) -- colonnes alignées quelle que soit la
   longueur du texte, contrairement aux lignes en flex/space-between précédentes.
   Demandé : "utilisé un tableau avec filtre et coloré. Pour au moins avoir l'alignement des
   statuts... même chose dans la page résultat, ce n'est pas très propre". */
.sup-table{width:100%;border-collapse:collapse;font-size:.85rem;}
.sup-table th{
  text-align:left;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:.72rem;
  text-transform:uppercase;letter-spacing:.03em;color:var(--ink-soft);padding:8px 10px;
  border-bottom:2px solid rgba(28,43,57,.1);
}
.sup-table td{padding:9px 10px;border-bottom:1px solid rgba(28,43,57,.07);}
.sup-table tr:last-child td{border-bottom:none;}
.sup-table tbody tr:hover{background:rgba(12,91,160,.03);}
.sup-score-pill{
  display:inline-block;padding:2px 10px;border-radius:20px;font-weight:700;font-size:.8rem;
  font-family:'Space Grotesk',sans-serif;
}
/* Barre de réussite colorée (résultats Supervision) -- signalé : "une barre de réussite,
   progression colorée". */
.sup-progress-bar{width:100%;height:8px;border-radius:5px;background:rgba(28,43,57,.08);overflow:hidden;}
.sup-progress-fill{height:100%;border-radius:5px;transition:width .3s ease;}
.tool-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.tool-row select, .tool-row input[type=text]{
  padding:9px 12px;border-radius:8px;border:1px solid rgba(28,43,57,.2);font-family:'Inter',sans-serif;font-size:.88rem;
}

/* ---------- Devoirs (prof) : différenciation visuelle des zones et des types d'activité --
   signalé : "la présentation c'est pas terrible... différencier les zones de création et de
   devoir créés, ajouter des couleurs". Zone de création = liseré bleu (--accent), zone des
   devoirs déjà créés = liseré vert (cohérent avec le vert "déjà fait" utilisé ailleurs sur le
   site, cm-badge-perfect notamment). Chaque type d'activité a sa propre couleur, reprise à la
   fois sur le sélecteur de type et sur chaque ligne de la liste -- mêmes couleurs que les
   groupes d'Automatismes (cm-group-header) pour rester cohérent avec le reste du site. */
.devoir-zone-create{border-top:4px solid var(--accent);}
.devoir-zone-list{border-top:4px solid #1F7A4D;}
.devoir-zone-title{display:flex;align-items:center;gap:8px;margin:0 0 14px;}
.devoir-type-btn{
  border:1.5px solid var(--dt-color,rgba(28,43,57,.18));
  background:var(--dt-bg,rgba(28,43,57,.04));
  color:var(--dt-color,var(--ink-soft));
  border-radius:8px;padding:7px 14px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.83rem;
  cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.15s;
}
.devoir-type-btn:hover{filter:brightness(.97);transform:translateY(-1px);}
.devoir-type-btn.active{background:var(--dt-color,var(--accent));color:#fff;border-color:var(--dt-color,var(--accent));}
.devoir-row{
  border-left:4px solid var(--dt-color,rgba(28,43,57,.15));background:rgba(28,43,57,.02);
  border-radius:0 8px 8px 0;padding:10px 12px;margin-top:8px;
}
.devoir-row-type{font-weight:700;color:var(--dt-color,var(--ink-soft));}
.devoir-target-pill{
  display:inline-block;padding:1px 9px;border-radius:20px;font-size:.7rem;font-weight:700;
  background:rgba(12,91,160,.1);color:var(--accent);vertical-align:middle;
}
/* Zones de l'onglet Devoirs de Supervision (Permis Rapporteur / Devoirs) -- même logique de
   liseré coloré que ci-dessus, pour distinguer les deux blocs plutôt qu'un même gris uniforme. */
.sup-zone{background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow);}
.sup-zone+.sup-zone{margin-top:10px;}
.sup-zone-permis{border-left:4px solid var(--accent);}
.sup-zone-devoirs{border-left:4px solid var(--accent-orange);}
.sup-zone-title{display:flex;align-items:center;gap:8px;font-size:.85rem;margin:0 0 8px;}
.sup-zone-title.permis{color:var(--accent);}
.sup-zone-title.devoirs{color:var(--accent-orange);}
.sup-session-row{display:flex;align-items:center;gap:8px;padding:5px 0;flex-wrap:wrap;}
#correctionInput{
  width:100%;min-height:120px;padding:14px;border-radius:8px;border:1px solid rgba(28,43,57,.2);
  font-family:'JetBrains Mono',monospace;font-size:1rem;line-height:1.6;resize:vertical;
}
.correction-preview{
  background:var(--paper);border:1.5px dashed rgba(28,43,57,.25);border-radius:8px;padding:20px;
  min-height:100px;font-size:1.15rem;line-height:2;margin-top:14px;transition:.2s;
}
.cor-header{margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(28,43,57,.12);}
.cor-header-title{font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--accent);font-size:1.05rem;}
.cor-header-date{font-size:.85rem;color:var(--ink-soft);margin-top:2px;text-transform:capitalize;}

.hint-mono{font-family:'JetBrains Mono',monospace;font-size:.76rem;color:var(--ink-soft);}
.format-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px;}
.fmt-btn{width:32px;height:32px;border-radius:6px;border:1px solid rgba(28,43,57,.2);background:#fff;cursor:pointer;font-family:'Space Grotesk',sans-serif;font-size:.9rem;}
.fmt-btn:hover{background:rgba(28,43,57,.06);}
.fmt-swatch{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(28,43,57,.25);background:var(--c);cursor:pointer;padding:0;}
.fmt-swatch:hover{box-shadow:0 0 0 2px rgba(28,43,57,.45);}
.fig-mode.active{background:var(--accent);color:#fff;}
.cahier-entry{
  background:var(--white);border:1px solid rgba(28,43,57,.1);border-radius:8px;padding:16px 18px;margin-bottom:12px;
  display:flex;justify-content:space-between;gap:14px;align-items:flex-start;
}
.cahier-entry .ref{font-family:'JetBrains Mono',monospace;font-size:.74rem;color:var(--ink-soft);margin-bottom:4px;}
.cahier-entry .body{font-size:1.02rem;line-height:1.9;flex:1;}
.cahier-entry .remove{border:none;background:transparent;color:var(--accent-orange);cursor:pointer;font-size:.8rem;font-weight:600;flex:none;}
.hamburger{
  display:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;
  width:36px;height:36px;flex:none;border:none;background:transparent;cursor:pointer;padding:0;
}
.hamburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;}
@media (max-width:720px){
  .hero{grid-template-columns:1fr;}
  .level-grid{grid-template-columns:1fr;}
  .mini-links{grid-template-columns:1fr;}
  .nav-links button{padding:8px 9px;font-size:.82rem;}
  /* Sur petit écran, chaque pixel compte pour les figures et widgets interactifs (rapporteur,
     schémas...) : on réduit les marges qui ne servent qu'à aérer la mise en page. */
  main{padding-left:10px;padding-right:10px;}
  .figure-wrap{padding-left:8px;padding-right:8px;}

  /* Menu hamburger : le logo agrandi laisse peu de place pour la liste des boutons de
     navigation sur mobile, on la replie donc dans un panneau déroulant. */
  .hamburger{display:flex;}
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0; z-index:60;
    flex-direction:column; gap:2px; background:var(--paper);
    padding:8px; border-bottom:1px solid rgba(28,43,57,.12);
    box-shadow:0 10px 20px rgba(28,43,57,.12);
  }
  .nav-links.open{display:flex;}
  /* Signalé : "Sur smartphone, le menu commence à être interminable et peu lisible" (tous les
     sous-menus dépliés les uns sous les autres). Désormais : Accueil / 6e / 5e sur une ligne,
     puis des sections repliables (S'entraîner, Outils prof) fermées par défaut, dont les entrées
     s'affichent sur deux colonnes, avec une icône ; le sous-menu Évaluations est mis à plat. */
  .nav-links{flex-direction:row;flex-wrap:wrap;gap:6px;max-height:calc(100vh - 70px);overflow-y:auto;}
  .nav-links > button{flex:1 1 100%;width:100%;text-align:left;padding:12px 14px;font-size:.95rem;border-radius:10px;}
  .nav-links > button[data-nav="home"], .nav-links > button[data-nav="niveau"]{flex:1 1 0;min-width:0;text-align:center;padding:11px 6px;background:rgba(28,43,57,.05);font-weight:700;}
  .nav-links > button[data-nav="home"].active, .nav-links > button[data-nav="niveau"].active{background:#0D5BA3;}
  .nav-dropdown{display:block;flex:1 1 100%;width:100%;}
  .nav-dropdown-trigger{display:flex !important;align-items:center;justify-content:space-between;width:100%;text-align:left;padding:12px 14px !important;font-size:.95rem !important;font-weight:700;border-radius:10px;background:rgba(28,43,57,.04);}
  .nav-dropdown > .nav-dropdown-trigger::after{content:'▸';font-size:.9em;opacity:.6;transition:transform .15s;display:inline-block;}
  .nav-dropdown.open > .nav-dropdown-trigger::after{transform:rotate(90deg);}
  .nav-dropdown.open > .nav-dropdown-trigger{background:rgba(13,91,163,.09);color:#0D5BA3;}
  .nav-dropdown-menu{display:none !important;position:static;box-shadow:none;border:none;padding:4px 0 6px;margin:0;background:transparent;min-width:0;}
  .nav-dropdown.open .nav-dropdown-menu{display:grid !important;grid-template-columns:1fr 1fr;gap:4px;}
  .nav-dropdown-menu button{width:100%;text-align:left;white-space:normal;padding:10px 10px !important;font-size:.86rem !important;line-height:1.25;border-radius:9px;background:#fff;border:1px solid rgba(28,43,57,.08);display:flex;align-items:center;gap:6px;}
  .nav-dropdown-menu button .gicon{font-size:1.15rem;color:#0D5BA3;flex:none;}
  .nav-dropdown-menu .nav-doublon{display:none !important;} /* déjà dans S'entraîner */
  .nav-sub{display:contents;}
  .nav-sub-trigger{display:none !important;}
  .nav-sub-menu{display:contents !important;}
  .brand-mark{height:40px !important;}

  /* Barre d'onglets des chapitres (Cours/Méthode/Exercices/Quiz/Histoire) : 5 onglets ne
     tiennent pas sur la largeur d'un téléphone. Plutôt que de les tasser ou de les faire
     retourner à la ligne, on les rend défilables horizontalement, sur une seule ligne. */
  .tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;scrollbar-width:thin;}
  .tab-btn{white-space:nowrap;flex:none;padding:10px 12px;font-size:.82rem;}
}

/* KaTeX applique par défaut font:1.21em à sa classe racine .katex (voir katex.css),
   ce qui fait apparaître toutes les formules ~21% plus grandes que le texte
   environnant. On neutralise ce facteur pour aligner la taille des formules
   (fractions, \widehat, etc.) sur celle du texte courant. Même ramenée à une
   taille nominale égale, la police mathématique de KaTeX paraît visuellement
   plus petite que le texte courant (métriques de police différentes) : on
   compense donc par un léger surplus. */
.katex { font-size: 1.18em; }

/* ---------- modale signalement de bug ---------- */
.bug-tab{background:none;border:none;padding:8px 4px;margin-right:14px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:.9rem;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent;}
.bug-tab.active{color:var(--accent);border-bottom-color:var(--accent);}

/* ---------- bouton bascule (ex: lecture intérieure/extérieure du rapporteur) ---------- */
button.btn.secondary.active{background:var(--accent);color:#fff;}

/* ---------- Ma progression : blocs déplaçables ---------- */
.prog-list{display:flex;flex-direction:column;gap:10px;margin-top:14px;max-width:640px;}
.prog-card{
  background:var(--white);border-radius:10px;border-left:5px solid var(--accent);
  box-shadow:var(--shadow);padding:12px 16px;display:flex;align-items:center;gap:12px;
  transition:transform .12s, box-shadow .12s;cursor:grab;
}
.prog-card:active{cursor:grabbing;}
.prog-card.dragging{opacity:.4;}
.prog-card.drag-over{transform:translateY(4px);box-shadow:0 0 0 2px var(--accent) inset;}
.prog-card .drag-handle{font-size:1.1rem;color:var(--ink-soft);flex:none;user-select:none;}
.prog-card .prog-main{flex:1;min-width:0;}
.prog-card .prog-titre{font-weight:700;font-family:'Space Grotesk',sans-serif;font-size:.95rem;}
.prog-card .prog-titre.perso{color:var(--accent);}
.prog-card .prog-titre-orig{font-size:.72rem;color:var(--ink-soft);font-weight:400;}
.prog-card .prog-dates{font-family:'JetBrains Mono',monospace;font-size:.78rem;color:var(--ink-soft);margin-top:2px;}
.prog-card .prog-edit-btn{flex:none;border:none;background:rgba(28,43,57,.06);border-radius:50%;width:30px;height:30px;cursor:pointer;font-size:.9rem;}
.prog-card .prog-edit-btn:hover{background:rgba(28,43,57,.14);}
.prog-card-edit{display:flex;flex-direction:column;gap:8px;flex:1;}
.prog-card-edit input[type="text"]{width:100%;box-sizing:border-box;}
.prog-card-edit .prog-edit-dates{display:flex;gap:10px;flex-wrap:wrap;}
.prog-vac-banner{
  display:flex;align-items:center;gap:10px;background:rgba(255,130,8,.10);border:1px dashed rgba(255,130,8,.4);
  border-radius:10px;padding:8px 16px;font-size:.82rem;color:#8A4210;font-weight:600;
}

/* ---------- Tableau interactif en plein écran ---------- */
#tbFullscreenWrap:fullscreen, #tbFullscreenWrap:-webkit-full-screen{
  background:var(--paper);padding:14px;box-sizing:border-box;
  width:100vw;height:100vh;overflow:auto;align-content:flex-start;
}
/* Le SVG du tableau n'a qu'une largeur fixée (width="100%", pas de hauteur), sa hauteur
   suit automatiquement le ratio de son viewBox. Sans cette limite, en plein écran (bien
   plus large que la mise en page normale, qui contraignait déjà sa largeur), il grossissait
   démesurément en hauteur -- débordement de l'écran, et outils disproportionnés/difficiles
   à manipuler. On borne ici sa hauteur, en laissant sa largeur s'ajuster automatiquement
   (width:auto) pour conserver le ratio. */
#tbFullscreenWrap:fullscreen #tbSvg, #tbFullscreenWrap:-webkit-full-screen #tbSvg{
  width:auto;max-width:100%;max-height:calc(100vh - 230px);
}

/* ---------- Outil de figure : barre latérale à icônes ---------- */
.fig-icon-btn{
  width:44px;height:44px;flex:none;border:2px solid rgba(28,43,57,.18);border-radius:9px;
  background:#fff;cursor:pointer;font-size:1.25rem;display:flex;align-items:center;justify-content:center;
  padding:0;line-height:1;color:var(--ink,#1C2B39);
}
/* Icônes plus grandes et plus lisibles (demandé : « des icônes un peu plus grosses, plus lisibles »). */
.fig-icon-btn svg{width:28px;height:28px;}
.fig-icon-btn svg line, .fig-icon-btn svg path, .fig-icon-btn svg polygon, .fig-icon-btn svg polyline, .fig-icon-btn svg rect{stroke-width:1.7;}
#figTip{position:fixed;z-index:10060;display:none;max-width:260px;background:#1F2A37;color:#fff;border-radius:8px;padding:7px 10px;font-size:.82rem;line-height:1.35;box-shadow:0 6px 18px rgba(0,0,0,.25);pointer-events:none;}
#figTip b{display:block;font-family:'Space Grotesk',sans-serif;font-size:.9rem;}
#figTip span{display:block;color:#D5DEE8;margin-top:2px;}
#figTip span::first-letter{text-transform:uppercase;}
.fig-icon-btn.active{border-color:#0D5BA3;background:rgba(13,91,163,.12);}
.fig-icon-btn:hover{border-color:rgba(28,43,57,.35);}
.fig-group-wrap{position:relative;display:inline-block;}
.fig-group-corner{
  position:absolute;bottom:-5px;right:-5px;width:18px;height:18px;border-radius:50%;
  border:1px solid rgba(28,43,57,.3);background:#fff;font-size:.62rem;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
  color:var(--ink-soft);z-index:5;
}
.fig-group-corner:hover{border-color:rgba(28,43,57,.55);background:rgba(28,43,57,.06);}
.fig-group-sub{
  display:none;flex-direction:column;gap:4px;padding:6px;
  position:absolute;top:calc(100% + 4px);left:0;z-index:30;
  background:#fff;border:1px solid rgba(28,43,57,.18);border-radius:10px;
  box-shadow:0 8px 24px rgba(28,43,57,.18);
}
.fig-group-sub.open{display:flex;}

/* ---- Cours personnalisés (cours-perso.js) ---- */
.cp-hidden{display:none!important;}
.cp-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:8px 0 14px;}
.cp-bar .btn{font-size:.82rem;}
.cp-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;font-size:.82rem;font-weight:600;background:#E7F0F9;color:#0C5BA0;}
.cp-chip .gicon{font-size:1.05rem;}
.cp-chip-orig{background:#EEF0F3;color:var(--ink-soft);}
.cp-chip-edit{background:var(--accent-orange);color:#fff;}
#view-chapitre.lvl-5e .cp-chip-edit{background:var(--accent);}
#view-chapitre.lvl-4e .cp-chip-edit{background:var(--accent-4e);}
#view-chapitre.lvl-3e .cp-chip-edit{background:var(--accent-3e);}
.cp-link{background:none;border:none;padding:0;color:var(--accent);font:inherit;font-size:.82rem;text-decoration:underline;cursor:pointer;}
.cp-edit-mode{padding-left:4px;}
.cp-eb{display:flex;gap:10px;align-items:flex-start;border:1.5px dashed rgba(28,43,57,.22);border-radius:10px;padding:8px 10px 8px 6px;margin:0 0 10px;background:#fff;transition:background .2s,opacity .2s;}
.cp-eb:hover{border-color:var(--accent-orange);}
#view-chapitre.lvl-5e .cp-eb:hover{border-color:var(--accent);}
#view-chapitre.lvl-4e .cp-eb:hover{border-color:var(--accent-4e);}
#view-chapitre.lvl-3e .cp-eb:hover{border-color:var(--accent-3e);}
.cp-eb-h1{border-style:solid;border-color:rgba(28,43,57,.35);margin-top:14px;}
.cp-eb-body{flex:1;min-width:0;}
.cp-eb-body > :last-child{margin-bottom:0;}
.cp-eb-ctl{display:grid;grid-template-columns:30px 30px;gap:3px;flex:0 0 auto;position:sticky;top:70px;}
.cp-eb-ctl button,.cp-eb-handle{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:7px;border:none;background:#F2F4F7;color:var(--ink-soft);cursor:pointer;padding:0;}
.cp-eb-ctl button:hover,.cp-eb-handle:hover{background:#E3E7EC;color:#1C2B39;}
.cp-eb-handle{cursor:grab;background:transparent;}
.cp-eb-ctl .gicon{font-size:1.15rem;}
.cp-eb-hidden{opacity:.45;background:repeating-linear-gradient(135deg,#fff 0 10px,#F4F5F7 10px 20px);}
.cp-eb-hidden .cp-eye{background:#FDE7E4;color:#B3261E;}
.cp-eb.cp-drag{opacity:.5;border-color:var(--accent-orange);}
.cp-eb.cp-flash{background:#FFF4E5;}
.cp-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:9999;background:#1C2B39;color:#fff;padding:10px 18px;border-radius:10px;font-size:.9rem;box-shadow:0 8px 24px rgba(0,0,0,.2);transition:opacity .5s;max-width:calc(100vw - 32px);}
.cp-toast-out{opacity:0;}
@media print{ .cp-bar{display:none!important;} }
/* Étape 2 : blocs ajoutés par le professeur */
.cp-rich > p{margin:0 0 8px;line-height:1.6;}
.cp-rich > p:last-child{margin-bottom:0;}
.cp-par,.cp-example{margin:0 0 16px;}
.cp-hint{margin:8px 0 16px;}
.cp-hint > p{margin:0 0 4px;}
.cp-list{margin:4px 0 8px;padding-left:22px;line-height:1.6;}
.cp-example .example-list{margin-bottom:8px;}
.cp-eb-custom{border-color:rgba(12,91,160,.45);}
.cp-eb{position:relative;}
.cp-mine-tag{position:absolute;top:-9px;right:14px;font-size:.7rem;font-weight:700;letter-spacing:.02em;color:#0C5BA0;background:#E7F0F9;border:1px solid rgba(12,91,160,.3);border-radius:6px;padding:0 8px;line-height:16px;}
.cp-eb-body > .lesson-header,.cp-eb-body > .sub-header{margin-top:0;}
.cp-eb-ctl .cp-add{color:#0C5BA0;}
.cp-eb-ctl .cp-del:hover{background:#FDE7E4;color:#B3261E;}
.cp-add-top{display:flex;align-items:center;gap:6px;margin:0 0 10px;padding:6px 12px;border:1.5px dashed rgba(12,91,160,.45);border-radius:10px;background:#F5F9FD;color:#0C5BA0;font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;width:100%;justify-content:center;}
.cp-add-top:hover{background:#E7F0F9;}
.cp-form{border:2px solid var(--accent-orange);border-radius:12px;padding:14px 16px;margin:0 0 12px;background:#fff;box-shadow:0 6px 20px rgba(28,43,57,.08);}
#view-chapitre.lvl-5e .cp-form{border-color:var(--accent);}
#view-chapitre.lvl-4e .cp-form{border-color:var(--accent-4e);}
#view-chapitre.lvl-3e .cp-form{border-color:var(--accent-3e);}
.cp-form-title{font-family:'Space Grotesk',sans-serif;font-weight:700;margin:0 0 10px;}
.cp-kinds{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;}
.cp-kinds button{display:inline-flex;align-items:center;gap:4px;border:1px solid rgba(28,43,57,.18);background:#fff;border-radius:999px;padding:4px 11px;font:inherit;font-size:.8rem;cursor:pointer;color:var(--ink);}
.cp-kinds button .gicon{font-size:1rem;}
.cp-kinds button.on{background:#1C2B39;color:#fff;border-color:#1C2B39;}
.cp-f-label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:var(--ink-soft);margin:0 0 10px;}
.cp-f-label input,.cp-form textarea{font:inherit;font-size:.95rem;border:1px solid rgba(28,43,57,.25);border-radius:8px;padding:8px 10px;width:100%;box-sizing:border-box;color:var(--ink);background:#fff;}
.cp-form textarea{resize:vertical;min-height:110px;line-height:1.5;}
.cp-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0 0 6px;}
.cp-tools button{display:flex;align-items:center;justify-content:center;width:32px;height:30px;border-radius:7px;border:1px solid rgba(28,43,57,.15);background:#F7F8FA;cursor:pointer;color:var(--ink);padding:0;}
.cp-tools button:hover{background:#E9ECF0;}
.cp-f-prevlabel{font-size:.75rem;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;margin:12px 0 6px;}
.cp-f-preview{border:1px dashed rgba(28,43,57,.2);border-radius:8px;padding:12px;background:var(--paper);}
.cp-f-preview > :last-child{margin-bottom:0;}
.cp-f-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;}
.cp-eb-ctl{grid-auto-rows:30px;}
/* Étape 4 : figures dynamiques ajoutées par le professeur */
.cp-fig-wrap{padding:12px;}
.cp-fig{display:block;width:100%;max-width:640px;height:auto;margin:0 auto;background:#fff;touch-action:none;user-select:none;-webkit-user-select:none;}
.cp-fig-handle{fill:rgba(255,130,8,.16);stroke:rgba(255,130,8,.55);stroke-width:1;}
#view-chapitre.lvl-5e .cp-fig-handle{fill:rgba(12,91,160,.14);stroke:rgba(12,91,160,.5);}
#view-chapitre.lvl-4e .cp-fig-handle{fill:rgba(11,122,131,.14);stroke:rgba(11,122,131,.5);}
#view-chapitre.lvl-3e .cp-fig-handle{fill:rgba(122,62,157,.14);stroke:rgba(122,62,157,.5);}
.cp-fig-dragging{cursor:grabbing!important;}
.cp-fig-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;}
.cp-fig-reset{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:none;background:rgba(28,43,57,.07);color:var(--ink-soft);cursor:pointer;flex:0 0 auto;}
.cp-fig-reset:hover{background:rgba(28,43,57,.14);color:var(--ink);}
.cp-f-figrow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 10px;}
/* Étape 5 : méthode pas à pas, rédaction type, exercices ; partage entre collègues */
.cp-steps .step-list{margin-top:0;}
.cp-exo .exo-card .cp-rich > p{margin:4px 0 0;}
.cp-exo .exo-correction > p{margin:0 0 6px;}
.cp-exo .exo-correction > :last-child{margin-bottom:0;}
.cp-share{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--ink-soft);cursor:pointer;}
.cp-chip-prev{background:#FFF4E5;color:#9A4B00;}
.cp-shared-list{width:100%;display:flex;flex-direction:column;gap:6px;margin-top:2px;}
.cp-shared-item{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;padding:8px 12px;border:1px solid rgba(28,43,57,.12);border-radius:10px;background:#fff;font-size:.88rem;}
.cp-shared-actions{display:flex;gap:6px;flex-wrap:wrap;}
.cp-f-exowrap{margin:0 0 4px;}
.cp-f-exos{display:flex;flex-direction:column;gap:10px;margin:0 0 8px;}
.cp-f-exo{border:1px solid rgba(28,43,57,.14);border-radius:10px;padding:10px;background:#FAFBFC;display:flex;flex-direction:column;gap:6px;}
.cp-f-exo-head{display:flex;align-items:center;justify-content:space-between;font-size:.85rem;}
.cp-f-exo-del{border:none;background:none;cursor:pointer;color:var(--ink-soft);display:flex;padding:2px;}
.cp-f-exo textarea{min-height:0;}
.cp-form .cp-f-exo-c{background:#F2F3F5;}
/* Constructions aux instruments ajoutées par le professeur */
.cp-geo-fig{text-align:center;}
.cp-geo-svg{display:inline-block;max-width:100%;height:auto;}
.cp-f-georow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 10px;}
/* Accueil : nouveautés en vidéo (fichiers servis par le site, chargés seulement à la lecture) */
.news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:8px;}
.news-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid rgba(28,43,57,.08);overflow:hidden;display:flex;flex-direction:column;}
.news-card video{display:block;width:100%;aspect-ratio:16/9;background:#1C2B39;object-fit:cover;}
.news-body{padding:14px 18px 18px;}
.news-body h3{margin:6px 0 6px;font-family:'Space Grotesk',sans-serif;font-size:1.08rem;line-height:1.3;}
.news-body p{margin:0;color:var(--ink-soft);font-size:.88rem;line-height:1.55;}
.news-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--accent-orange);}
@media (max-width:720px){ .news-grid{grid-template-columns:1fr;} }

/* ---------- accueil : vignettes avec vidéo en accordéon ---------- */
.mini-link .t{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.mv-new{background:#D93025;color:#fff;border-radius:999px;padding:1px 8px;font:700 .68rem Inter,sans-serif;letter-spacing:.3px;}
.mv-btn{display:inline-flex;align-items:center;gap:5px;margin-top:10px;border:1.5px solid rgba(12,91,160,.25);background:rgba(12,91,160,.06);color:#0C5BA0;
  border-radius:999px;padding:4px 12px 4px 8px;font:600 .8rem Inter,sans-serif;cursor:pointer;}
.mv-btn .gicon{font-size:1.2rem;} .mv-btn small{color:#5B6472;font-weight:500;}
.mv-btn:hover{background:rgba(12,91,160,.12);}
.mini-link.open{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:22px;align-items:start;cursor:default;transform:none;border-color:rgba(12,91,160,.35);}
.mini-link.open .mv-btn{background:#0C5BA0;color:#fff;border-color:#0C5BA0;} .mini-link.open .mv-btn small{color:rgba(255,255,255,.8);}
.mini-link.open .t{font-size:1.15rem;} .mini-link.open .d{font-size:.92rem;}
.mv-panel video{display:block;width:100%;aspect-ratio:16/9;background:#1C2B39;border-radius:10px;}
.mv-go{margin:10px 0 0 6px;padding:5px 14px;font-size:.8rem;border-radius:999px;vertical-align:top;}
@media (max-width:900px){ .mini-link.open{grid-template-columns:1fr;} }
.home-extras{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px;}
.home-extras .plain-card{padding:18px 20px;display:flex;flex-direction:column;align-items:flex-start;}
.home-extras h3{margin:0 0 6px;font-size:1.05rem;display:flex;align-items:center;gap:6px;}
.home-extras p{margin:0 0 12px;color:var(--ink-soft);font-size:.88rem;flex:1;}
.home-extras-btns{display:flex;gap:8px;flex-wrap:wrap;}
@media (max-width:900px){ .home-extras{grid-template-columns:1fr;} }

/* « Mon travail » (élève) : rejoindre une séance en direct avec le code du tableau (devoirs.js). */
.mt-direct{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 6px;padding:12px 16px;border-radius:14px;background:rgba(217,48,37,.06);border:1px solid rgba(217,48,37,.22);max-width:760px;}
.mt-direct > .gicon{font-size:1.6rem;color:#D93025;}
.mt-direct-t{display:flex;flex-direction:column;flex:1;min-width:180px;}
.mt-direct-t small{color:var(--ink-soft);}
.mt-direct input{width:110px;font-size:1.15rem;letter-spacing:.2em;text-align:center;padding:8px 10px;border:1px solid var(--line,#D5DAE1);border-radius:10px;font-family:'JetBrains Mono',monospace;margin:0;}
.mt-direct .btn{margin:0;}
@media (max-width:520px){ .mt-direct input{flex:1;} }

/* Pas à pas dans le cahier (app.js, cahierAnimerEtapes) : une étape à la fois à l'écran, toutes à l'impression. */
.cs-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:6px 0 8px;}
.cs-bar button{border:1px solid rgba(28,43,57,.15);background:#fff;border-radius:8px;padding:5px 10px;font:inherit;font-size:.82rem;cursor:pointer;color:var(--ink);}
.cs-bar button.cs-main{background:#0D5BA3;border-color:#0D5BA3;color:#fff;font-weight:700;}
.cs-bar button:disabled{opacity:.4;cursor:default;}
.cs-bar .cs-n{font-weight:700;font-size:.85rem;min-width:84px;text-align:center;}
.cs-bar.cs-tout .cs-n,.cs-bar.cs-tout [data-cs="prev"],.cs-bar.cs-tout [data-cs="next"]{display:none;}
.cs-film .cs-panel{display:none !important;}
.cs-film .cs-panel.cs-on{display:flex !important;flex-direction:column;align-items:flex-start;gap:8px !important;animation:csFondu .35s ease;}
.cs-film .cs-panel img{width:100% !important;max-width:380px;}
/* Signalé : "Sur smartphone dans le cahier, je n'ai pas l'image de l'exercice corrigé". Les blocs d'une
   correction gardent la taille réglée sur ordinateur (ex. width:814px;height:195px;overflow:hidden) :
   sur un écran étroit, l'image centrée dans ce cadre tombait hors de l'écran. À l'écran, un bloc ne
   dépasse plus la largeur du cahier ; une image s'y réduit (hauteur ajustée) ; un autre bloc trop
   large (figure, tableau) se fait défiler horizontalement. L'impression garde les tailles réglées. */
@media screen{
  .cahier-print-entry{min-width:0;max-width:100%;}
  .cahier-print-entry > .nb-figure-row{max-width:100%;overflow-x:auto;}
  .cahier-print-entry .nb-figure-row.disk-sync-target{max-width:100% !important;}
  .cahier-print-entry .nb-figure-row.disk-sync-target[data-type="image"]{height:auto !important;}
  .cahier-print-entry .nb-figure-row.disk-sync-target[data-type="image"] img{max-width:100% !important;height:auto !important;}
}
.cs-film .cs-panel > div{font-size:.95rem !important;}
.cs-film.cs-tout .cs-panel{display:flex !important;flex-direction:row;align-items:center;animation:none;}
.cs-film.cs-tout .cs-panel img{width:170px !important;}
.cs-film.cs-tout .cs-panel > div{font-size:.8rem !important;}
@keyframes csFondu{from{opacity:0;}to{opacity:1;}}
.cs-film .cs-panel > svg.cs-vivant{display:none;}
.cs-film .cs-panel.cs-anime > svg.cs-vivant{display:block;width:100%;max-width:380px;height:auto;flex:none;align-self:stretch;background:#fff;border-radius:6px;border:1px solid rgba(28,43,57,.12);}
.cs-film .cs-panel.cs-anime > img{display:none !important;}
.cs-film .cs-panel.cs-depart > div:not(.cs-dep){display:none;}
.cs-film .cs-panel > .cs-dep{font-size:.9rem !important;color:var(--ink-soft);font-style:italic;}
.cs-film.cs-tout .cs-panel > .cs-dep{display:none;}
.cs-film.cs-tout .cs-panel.cs-depart > div:not(.cs-dep){display:block;}
.cs-film.cs-a .cs-panel.cs-on > img,.cs-film.cs-a .cs-panel.cs-on > svg.cs-vivant{cursor:pointer;}
.cs-film.cs-tout .cs-panel > svg.cs-vivant{display:none !important;}
.cs-film.cs-tout .cs-panel.cs-anime > img{display:block !important;}
@media print{
  .cs-bar{display:none !important;}
  .cs-film .cs-panel > svg.cs-vivant{display:none !important;}
  .cs-film .cs-panel.cs-anime > img{display:block !important;}
  .cs-film .cs-panel > .cs-dep{display:none !important;}
  .cs-film .cs-panel.cs-depart > div:not(.cs-dep){display:block !important;}
  .cs-film .cs-panel{display:flex !important;flex-direction:row !important;align-items:center !important;animation:none !important;}
  .cs-film .cs-panel img{width:170px !important;}
  .cs-film .cs-panel > div{font-size:.8rem !important;}
}

/* Géométrie Interactive : plein écran et écran partagé (figure à gauche, tableau aux instruments à droite). */
#toolsModalOverlay:fullscreen{background:#fff;padding:6px;align-items:stretch;}
#toolsModalOverlay:fullscreen > .modal-card{width:100% !important;max-width:100% !important;max-height:100% !important;border-radius:0;box-shadow:none;}
#toolsModalOverlay:fullscreen #figurePanel{max-width:none !important;max-height:none !important;}
#toolsModalOverlay:fullscreen #figureSvg{width:min(98vw, calc(76vh * 1.5625)) !important;}
body.fig-split #toolsModalOverlay{right:50%;background:#F4F6F9;padding:6px;align-items:stretch;}
body.fig-split #toolsModalOverlay > .modal-card{width:100% !important;max-width:100% !important;max-height:100% !important;padding:10px;}
body.fig-split #figurePanel{max-width:none !important;max-height:none !important;padding:4px !important;}
body.fig-split #figureSvg{width:min(100%, calc(64vh * 1.5625)) !important;}
body.fig-split #view-tableau{position:fixed;top:0;bottom:0;left:50%;right:0;z-index:99;overflow:auto;background:#fff;padding:10px 12px;margin:0;border-left:2px solid rgba(28,43,57,.15);}
/* À droite, seulement le tableau qui s'anime + « Enregistrer en image » / « Ajouter au cahier »
   (demandé : « je n'ai besoin que de la fenêtre qui s'anime et une sauvegarde ou ajouter au cahier »). */
body.fig-split #view-tableau > .back-btn, body.fig-split #view-tableau > h1, body.fig-split #view-tableau > p.hint,
body.fig-split #view-tableau > .tool-row, body.fig-split #tbToolPalette, body.fig-split #tbHistoryPanel, body.fig-split #tbHelpBox,
body.fig-split #tbFullscreenWrap > div > .tool-row{display:none !important;}
/* Barre de lecture (Depuis le début, Précédent, Étape suivante, Lecture, vitesse) : gardée, sous le tableau. */
body.fig-split #tbFullscreenWrap > div{display:flex;flex-direction:column;}
body.fig-split #tbBoardWrap{order:1;}
body.fig-split #tbAiPlaybackBar{order:2;margin:10px auto 0 !important;flex-wrap:nowrap !important;gap:8px !important;padding:6px 12px !important;}
body.fig-split #tbAiCloseBtn{display:none !important;}
body.fig-split #tbSplitActions{order:3;}
body.fig-split.fig-instr #tbSplitCahierBtn{display:none !important;}
body.fig-split #tbFullscreenWrap > div > #tbSplitActions.tool-row{display:flex !important;justify-content:center;}
body.fig-split #tbFullscreenWrap{display:block !important;}
body.fig-split #tbFullscreenWrap > div{min-width:0 !important;}
body.fig-split #tbBoardWrap{margin:0 auto;}
body.fig-split #figToTableauBtn, body.fig-split #figCompasTexte{display:none !important;}
body.fig-split #figurePanel .figure-toolbar{margin-top:6px !important;}
body.fig-split #figureHint{margin:4px 0 0 !important;min-height:1.2em;}

/* Fenêtre de projection de la construction aux instruments (outils-figures.js, ?proj=construction) :
   seul le tableau, sur toute la fenêtre. */
body.fig-proj{overflow:hidden !important;background:#fff !important;}
body.fig-proj *{visibility:hidden !important;}
body.fig-proj #tbBoardWrap, body.fig-proj #tbBoardWrap *, body.fig-proj #figProjAttente, body.fig-proj #figProjAttente *{visibility:visible !important;}
body.fig-proj #tbBoardWrap{position:fixed !important;inset:0 !important;width:100vw !important;height:100vh !important;z-index:2147483000;border:0 !important;border-radius:0 !important;background:#fff;}
body.fig-proj #tbSvg{display:block;width:100vw !important;height:100vh !important;}
#figProjAttente{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2147483001;display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;font-family:'Space Grotesk',Arial,sans-serif;color:#20242E;background:rgba(255,255,255,.92);padding:22px 30px;border-radius:14px;border:1px solid rgba(28,43,57,.12);}
#figProjAttente b{font-size:1.4rem;color:#1F7A4D;}
#figProjAttente small{color:#6B6F7A;}
#figProjBtn.active{background:#1F7A4D;color:#fff;border-color:#1F7A4D;}

/* ---------- Oliv'IA (olivia.js) ---------- */
.oliv-lanceur{position:fixed;right:18px;bottom:18px;z-index:9000;display:flex;align-items:center;gap:6px;border:0;background:none;padding:0;cursor:pointer;}
.oliv-lanceur svg{width:64px;height:64px;filter:drop-shadow(0 4px 10px rgba(28,43,57,.25));transition:transform .2s;}
.oliv-lanceur:hover svg{transform:translateY(-3px) rotate(-4deg);}
.oliv-lanceur-bulle{order:-1;background:#fff;border:1.5px solid #1F7A4D;color:#1F7A4D;font-weight:700;font-size:.85rem;border-radius:14px 14px 4px 14px;padding:6px 10px;box-shadow:0 2px 8px rgba(28,43,57,.12);}
.oliv-oeil{transform-box:fill-box;transform-origin:center;animation:olivCligne 4.5s infinite;}
@keyframes olivCligne{0%,92%,100%{transform:scaleY(1);}95%{transform:scaleY(.1);}}
.oliv-feuille{transform-box:fill-box;transform-origin:0% 50%;}
.oliv-bras{transform-box:fill-box;transform-origin:0% 100%;}
.oliv-lanceur:hover .oliv-bras{animation:olivCoucou .5s ease-in-out 3 alternate;}
@keyframes olivCoucou{from{transform:rotate(0);}to{transform:rotate(-18deg);}}
.reflechit .oliv-feuille, .oliv-lanceur:hover .oliv-feuille{animation:olivFeuille .8s ease-in-out infinite alternate;}
@keyframes olivFeuille{from{transform:rotate(-12deg);}to{transform:rotate(12deg);}}
.oliv-panneau{position:fixed;right:18px;bottom:18px;z-index:9001;width:min(380px, calc(100vw - 24px));height:min(560px, calc(100vh - 90px));display:flex;flex-direction:column;background:#fff;border:1.5px solid rgba(31,122,77,.35);border-radius:18px;box-shadow:0 12px 36px rgba(28,43,57,.25);overflow:hidden;font-family:'Space Grotesk',Arial,sans-serif;}
.oliv-tete{display:flex;align-items:center;gap:8px;padding:8px 10px;background:linear-gradient(135deg,#1F7A4D,#2E9E6A);color:#fff;}
.oliv-tete-avatar svg{width:40px;height:40px;background:#fff;border-radius:50%;padding:2px;}
.oliv-tete-nom{flex:1;display:flex;flex-direction:column;line-height:1.15;}
.oliv-tete-nom small{opacity:.85;font-size:.75rem;}
.oliv-x{background:rgba(255,255,255,.15);border:0;color:#fff;border-radius:50%;width:30px;height:30px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.oliv-x:hover{background:rgba(255,255,255,.3);}
.oliv-fil{flex:1;overflow-y:auto;position:relative;padding:12px;background:#F6FAF7;display:flex;flex-direction:column;gap:10px;}
.oliv-msg{display:flex;gap:6px;align-items:flex-end;max-width:100%;}
.oliv-msg.eleve{justify-content:flex-end;}
.oliv-msg .oliv-txt{padding:8px 11px;border-radius:14px;font-size:.92rem;line-height:1.45;max-width:85%;overflow-wrap:anywhere;}
.oliv-msg.oliv .oliv-txt{background:#fff;border:1px solid rgba(31,122,77,.2);border-bottom-left-radius:4px;color:#20242E;}
.oliv-msg.eleve .oliv-txt{background:#1F7A4D;color:#fff;border-bottom-right-radius:4px;}
.oliv-mini svg{width:26px;height:26px;flex:none;}
.oliv-cite{display:block;font-style:italic;opacity:.85;font-size:.82rem;margin-bottom:4px;}
.oliv-erreur{color:#A83C1F;}
.oliv-points i{display:inline-block;width:7px;height:7px;margin:0 2px;border-radius:50%;background:#1F7A4D;animation:olivPoint 1s infinite ease-in-out;}
.oliv-points i:nth-child(2){animation-delay:.15s;} .oliv-points i:nth-child(3){animation-delay:.3s;}
@keyframes olivPoint{0%,80%,100%{opacity:.25;transform:translateY(0);}40%{opacity:1;transform:translateY(-4px);}}
/* Suggestions courtes, sur une ou deux lignes, jamais coupées par le bord de la fenêtre. */
.oliv-suggest{display:flex;flex-wrap:wrap;gap:6px;padding:6px 10px 2px;}
.oliv-suggest .oliv-chip{white-space:nowrap;}
.oliv-chip{border:1px solid rgba(31,122,77,.4);background:#fff;color:#1F7A4D;border-radius:14px;padding:4px 10px;font-size:.78rem;cursor:pointer;}
.oliv-chip:hover{background:rgba(31,122,77,.08);}
.oliv-saisie{display:flex;gap:6px;padding:8px 10px;align-items:flex-end;}
.oliv-saisie textarea{flex:1;resize:none;border:1px solid rgba(28,43,57,.2);border-radius:12px;padding:8px 10px;font:inherit;font-size:.9rem;}
.oliv-saisie .btn{padding:8px 12px;}
.oliv-pied{margin:0;padding:0 10px 8px;font-size:.7rem;color:#6B6F7A;}
.oliv-sel{position:absolute;z-index:9002;display:flex;align-items:center;gap:6px;background:#fff;border:1.5px solid #1F7A4D;color:#1F7A4D;font-weight:700;font-size:.82rem;border-radius:16px;padding:4px 10px 4px 4px;box-shadow:0 4px 12px rgba(28,43,57,.2);cursor:pointer;}
.oliv-sel .oliv-mini svg{width:24px;height:24px;}
.oliv-carte-avatar svg{width:34px;height:34px;}
.oliv-bloc{border:1px solid rgba(28,43,57,.12);border-radius:10px;margin-bottom:8px;overflow:hidden;}
.oliv-bloc-tete{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 10px;background:rgba(28,43,57,.04);}
.oliv-tag{font-size:.72rem;background:rgba(31,122,77,.12);color:#1F7A4D;border-radius:8px;padding:1px 7px;}
.oliv-bloc-eleves{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px 12px;padding:8px 10px;font-size:.88rem;}
.oliv-bloc-eleves label{display:flex;align-items:center;gap:6px;}
.oliv-conv-eleve{border:1px solid rgba(28,43,57,.12);border-radius:10px;padding:6px 10px;margin-bottom:6px;}
.oliv-conv-eleve summary{cursor:pointer;}
.oliv-conv{margin:8px 0;padding:8px;background:#F6FAF7;border-radius:10px;display:flex;flex-direction:column;gap:6px;}
.oliv-conv-tete{font-size:.8rem;color:#4E5665;}
@media print{.oliv-lanceur,.oliv-panneau,.oliv-sel{display:none !important;}}

.oliv-conserv{margin-top:12px;padding:10px 12px;border-radius:10px;background:rgba(28,43,57,.04);display:flex;flex-direction:column;gap:6px;font-size:.9rem;}
.oliv-conserv.alerte{background:#FFF4E5;border:1px solid #F3C27A;}
.oliv-conserv-btns{display:flex;gap:8px;flex-wrap:wrap;}
.oliv-rappel{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:9500;display:flex;align-items:center;gap:10px;max-width:min(720px, calc(100vw - 24px));background:#fff;border:1.5px solid #F3C27A;border-radius:14px;padding:10px 14px;box-shadow:0 10px 30px rgba(28,43,57,.2);font-family:'Space Grotesk',Arial,sans-serif;}
.oliv-rappel > span:nth-child(2){display:flex;flex-direction:column;flex:1;} .oliv-rappel small{color:#5B6472;}
.oliv-rappel .oliv-mini svg{width:40px;height:40px;}

/* ---------- Outils de classe (classe.js) ---------- */
.cl-bloc{background:#fff;border:1px solid rgba(28,43,57,.12);border-radius:16px;padding:16px 18px;}
/* Disposition des blocs (classe.js, clDispo*) : scène aux positions en %, contenu qui grandit avec le bloc. */
.cl-barre{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin:12px 0 4px;}
.cl-barre-groupe{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.cl-barre-titre{font:600 .8rem 'Space Grotesk',Arial,sans-serif;text-transform:uppercase;letter-spacing:.04em;color:#5B6472;margin-right:2px;}
.cl-puce{display:inline-flex;align-items:center;gap:4px;border:1px solid rgba(28,43,57,.18);background:#fff;border-radius:999px;padding:4px 10px 4px 6px;cursor:pointer;font:500 .9rem 'Space Grotesk',Arial,sans-serif;color:#5B6472;}
.cl-puce .gicon{font-size:1.1rem;} .cl-puce.on{background:rgba(12,91,160,.08);border-color:#0C5BA0;color:#0C5BA0;}
.cl-modele{border:2px solid transparent;background:#fff;border-radius:8px;padding:2px;cursor:pointer;line-height:0;fill:#C9D3DE;}
.cl-modele:hover{fill:#9FB3C8;} .cl-modele.on{border-color:#0C5BA0;fill:#0C5BA0;}
.cl-libre-etiq{display:inline-flex;align-items:center;gap:4px;font-weight:600;color:#E07B00;margin-left:4px;}
.cl-barre-aide{flex-basis:100%;margin:0 !important;}
.cl-scene{position:relative;height:calc(100vh - 150px);min-height:620px;margin:6px -7px 0;}
.cl-scene:fullscreen{height:100%;margin:0;background:#F4EFE6;}
.cl-scene.cl-vide::after{content:'Cochez au moins un bloc à afficher.';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#5B6472;}
.cl-scene > .cl-bloc{position:absolute;box-sizing:border-box;overflow:auto;container-type:size;transition:left .25s,top .25s,width .25s,height .25s;}
.cl-scene.cl-libre > .cl-bloc{transition:none;box-shadow:0 4px 14px rgba(28,43,57,.10);}
.cl-bloc[hidden]{display:none !important;}
.cl-bloc.cl-saisi{z-index:50;transition:none;box-shadow:0 14px 34px rgba(28,43,57,.28);opacity:.96;}
.cl-bloc.cl-cible{outline:3px dashed #0C5BA0;outline-offset:-3px;}
.cl-titre-poignee{cursor:grab;user-select:none;touch-action:none;} .cl-saisi .cl-titre-poignee{cursor:grabbing;}
.cl-grip{color:#9AA3AF;font-size:1.2rem !important;margin-right:-4px;}
.cl-masquer{margin-left:auto;border:0;background:none;cursor:pointer;color:#9AA3AF;padding:2px;border-radius:6px;line-height:0;}
.cl-masquer:hover{background:rgba(28,43,57,.07);color:#20242E;}
.cl-taille{position:absolute;right:3px;bottom:3px;width:18px;height:18px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 50%,#9AA3AF 50%,#9AA3AF 58%,transparent 58%,transparent 70%,#9AA3AF 70%,#9AA3AF 78%,transparent 78%);border-radius:0 0 12px 0;}
.cl-bloc:fullscreen .cl-taille,.cl-bloc:fullscreen .cl-masquer,.cl-bloc:fullscreen .cl-grip{display:none;}
.cl-scene-quitter{display:none;position:absolute;bottom:10px;left:50%;transform:translateX(-50%);opacity:.5;z-index:60;border:0;border-radius:10px;background:rgba(28,43,57,.08);cursor:pointer;padding:6px;line-height:0;}
.cl-scene:fullscreen .cl-scene-quitter{display:block;}
.cl-scene:fullscreen .cl-bloc > p.hint{display:none;}
@container (max-height:430px){ .cl-bloc > p.hint{display:none;} }
.cl-scene .cl-roue-cadre, .cl-survol .cl-roue-cadre{width:max(150px,min(56cqw,calc(100cqh - 170px)));}
.cl-scene .cl-roue-gagnant, .cl-survol .cl-roue-gagnant{font-size:clamp(1.8rem,7cqmin,5rem);}
.cl-scene .cl-roue-tires{max-height:none;}
.cl-scene .cl-min-apercu, .cl-survol .cl-min-apercu{font-size:clamp(2.4rem,16cqmin,11rem);}
.cl-scene .cl-feu-svg, .cl-survol .cl-feu-svg{height:max(110px,min(calc(100cqh - 180px),40cqw));}
.cl-scene .cl-feu-texte .gicon{font-size:clamp(2.2rem,11cqmin,8rem);}
.cl-scene .cl-feu-texte b{font-size:clamp(1.5rem,8cqmin,6rem);}
.cl-scene .cl-feu-texte small{font-size:clamp(.95rem,3.4cqmin,2.2rem);}
.cl-scene .cl-feu-main, .cl-survol .cl-feu-main{font-size:clamp(1rem,3.8cqmin,2.4rem);}
.cl-scene #clBruitSvg, .cl-survol #clBruitSvg{width:max(180px,min(92cqw,calc((100cqh - 250px) * 1.8)));}
.cl-scene .cl-bruit-etat, .cl-survol .cl-bruit-etat{font-size:clamp(1.4rem,7cqmin,5rem);}
.cl-bloc:fullscreen{padding:28px;overflow:auto;}
.cl-bloc h2{margin:0 0 4px;font-size:1.25rem;display:flex;align-items:center;gap:8px;}
.cl-ligne{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0;}
.cl-ligne select{padding:6px 8px;border-radius:8px;min-width:200px;}
#clRoueLibre{width:100%;box-sizing:border-box;border-radius:10px;padding:8px;font:inherit;}
.cl-roue-zone{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start;}
.cl-roue-cadre{position:relative;width:min(340px,100%);aspect-ratio:1;flex:none;}
.cl-bloc:fullscreen .cl-roue-cadre{width:min(70vh,60vw);}
#clRoueSvg{width:100%;height:100%;display:block;filter:drop-shadow(0 6px 14px rgba(28,43,57,.2));}
#clRoueRot{transform-origin:0 0;}
.cl-roue-fleche{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-top:30px solid #20242E;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3));}
.cl-roue-lancer{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:4px solid #fff;background:#FF8208;color:#fff;font:700 1rem 'Space Grotesk',Arial,sans-serif;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.25);}
.cl-roue-lancer:disabled{background:#C9CED6;cursor:default;}
.cl-roue-listes{flex:1;min-width:180px;display:flex;flex-direction:column;gap:10px;}
.cl-roue-resultat{min-height:3.2em;}
.cl-roue-gagnant{display:inline-block;font:700 2.2rem 'Space Grotesk',Arial,sans-serif;color:#0C5BA0;animation:clPop .5s ease-out;}
.cl-bloc:fullscreen .cl-roue-gagnant{font-size:4rem;}
@keyframes clPop{0%{transform:scale(.3);opacity:0;}70%{transform:scale(1.15);}100%{transform:scale(1);opacity:1;}}
.cl-roue-tires{margin:4px 0 0;padding-left:22px;max-height:260px;overflow:auto;}
.cl-roue-tires li{margin:2px 0;}
.cl-mini{border:0;background:none;cursor:pointer;color:#5B6472;padding:0 4px;vertical-align:middle;}
.cl-roue-abs{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:2px 10px;margin-top:6px;font-size:.9rem;}
.cl-min-apercu{font:700 3rem 'JetBrains Mono',monospace;color:#20242E;text-align:center;margin:10px 0;}
.cl-min-flottant{position:fixed;right:24px;top:110px;z-index:9400;background:#fff;border:2px solid #1C2B39;border-radius:16px;box-shadow:0 12px 30px rgba(28,43,57,.28);padding:6px 10px 10px;min-width:210px;user-select:none;}
.cl-min-poignee{display:flex;align-items:center;gap:6px;cursor:move;color:#5B6472;}
.cl-min-poignee button,.cl-min-btns button,.cl-min-plein-haut button{border:0;background:rgba(28,43,57,.07);border-radius:8px;padding:4px 8px;cursor:pointer;font:600 .85rem 'Space Grotesk',Arial,sans-serif;color:#20242E;}
.cl-min-poignee button{margin-left:auto;} .cl-min-poignee button + button{margin-left:0;}
.cl-min-mini-sablier svg{width:22px;height:22px;display:block;}
.cl-min-flottant .cl-min-chiffres{font:700 2.6rem 'JetBrains Mono',monospace;text-align:center;color:#20242E;line-height:1.2;}
.cl-min-chiffres.fini{color:#C62828;animation:clClignote 1s steps(2,start) infinite;}
@keyframes clClignote{to{visibility:hidden;}}
.cl-min-btns{display:flex;gap:6px;justify-content:center;}
.cl-min-plein{position:fixed;inset:0;z-index:9600;background:radial-gradient(circle at 50% 40%,#FFFFFF,#F1EADC);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;}
.cl-min-plein-sablier svg{height:62vh;width:auto;display:block;}
.cl-min-plein .cl-min-chiffres{font:700 min(12vh,9vw) 'JetBrains Mono',monospace;color:#20242E;}
.cl-min-plein .cl-min-btns button{font-size:1.1rem;padding:8px 14px;}
.cl-min-plein-haut{position:absolute;top:14px;right:16px;display:flex;gap:8px;}
.cl-filet{animation:clFilet .4s linear infinite;}
@keyframes clFilet{0%{opacity:.7;}50%{opacity:1;}100%{opacity:.7;}}
@media (max-width:760px){
  .cl-scene{height:auto;min-height:0;display:flex;flex-direction:column;gap:14px;margin:6px 0 0;}
  .cl-scene > .cl-bloc{position:static;width:auto !important;height:auto !important;container-type:normal;}
  .cl-taille,.cl-grip,.cl-barre .cl-barre-groupe:nth-child(2),.cl-barre-aide{display:none;}
}

.cl-feu-affiche{display:flex;align-items:center;gap:22px;justify-content:center;margin-top:8px;}
.cl-feu-svg{height:210px;width:auto;flex:none;}
.cl-bloc:fullscreen .cl-feu-svg{height:70vh;}
.cl-feu-allume{filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 22px currentColor);}
.cl-feu-texte{display:flex;flex-direction:column;align-items:flex-start;gap:4px;font-family:'Space Grotesk',Arial,sans-serif;}
.cl-feu-texte .gicon{font-size:3rem;} .cl-feu-texte b{font-size:2.2rem;line-height:1.1;} .cl-feu-texte small{font-size:1.05rem;color:#4E5665;}
.cl-bloc:fullscreen .cl-feu-texte .gicon{font-size:7rem;} .cl-bloc:fullscreen .cl-feu-texte b{font-size:5.5rem;} .cl-bloc:fullscreen .cl-feu-texte small{font-size:2rem;}
.cl-feu-main{margin-top:10px;font-size:1.2rem;font-weight:700;color:#0C5BA0;background:rgba(12,91,160,.08);border-radius:10px;padding:4px 10px;}
.cl-bloc:fullscreen .cl-feu-main{font-size:2.2rem;}
.cl-bruit-zone{display:flex;flex-direction:column;align-items:center;gap:4px;}
#clBruitSvg{width:min(360px,100%);height:auto;}
.cl-bloc:fullscreen #clBruitSvg{width:min(80vw,120vh);}
.cl-bruit-etat{font:700 1.8rem 'Space Grotesk',Arial,sans-serif;}
.cl-bloc:fullscreen .cl-bruit-etat{font-size:4.5rem;}
.cl-bruit-alerte{animation:clAlerteFond 1s ease-in-out infinite alternate;}
@keyframes clAlerteFond{from{background:#fff;}to{background:#FDE3E3;}}

/* CM1 et CM2 : même dominance de couleur, en vert (école). */
#view-chapitre.lvl-cm .tab-btn.active{border-bottom-color:var(--accent-cm);}
#view-chapitre.lvl-cm button.btn:not(.secondary):not(.orange){background:var(--accent-cm);}
#view-chapitre.lvl-cm .lesson-header{background:var(--accent-cm);}
#view-chapitre.lvl-cm .lesson-header .num{color:var(--accent-cm);}
#view-chapitre.lvl-cm .sub-header .letter{background:var(--accent-cm);}
#view-chapitre.lvl-cm .cp-chip-edit{background:var(--accent-cm);}
#view-chapitre.lvl-cm .cp-eb:hover{border-color:var(--accent-cm);}
#view-chapitre.lvl-cm .cp-form{border-color:var(--accent-cm);}
#view-chapitre.lvl-cm .cp-fig-handle{fill:rgba(46,125,50,.14);stroke:rgba(46,125,50,.5);}
.level-card.cm{border-top:3px solid var(--accent-cm);}
.level-card.cm::before{content:""; position:absolute; right:-30px; top:-30px; width:120px;height:120px;border-radius:50%;background:radial-gradient(circle, rgba(46,125,50,.16), transparent 70%);}
.level-card.cm .lvl-new{background:var(--accent-cm);}

/* CM2 : vert émeraude foncé, pour le distinguer du CM1. */
#view-chapitre.lvl-cm2 .tab-btn.active{border-bottom-color:var(--accent-cm2);}
#view-chapitre.lvl-cm2 button.btn:not(.secondary):not(.orange){background:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .lesson-header{background:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .lesson-header .num{color:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .sub-header .letter{background:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .cp-chip-edit{background:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .cp-eb:hover{border-color:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .cp-form{border-color:var(--accent-cm2);}
#view-chapitre.lvl-cm2 .cp-fig-handle{fill:rgba(27,94,32,.14);stroke:rgba(27,94,32,.5);}
.level-card.cm2{border-top-color:var(--accent-cm2);}
.level-card.cm2::before{background:radial-gradient(circle, rgba(27,94,32,.16), transparent 70%);}
.level-card.cm2 .lvl-new{background:var(--accent-cm2);}

/* CE2 : vert tilleul. */
#view-chapitre.lvl-ce2 .tab-btn.active{border-bottom-color:var(--accent-ce2);}
#view-chapitre.lvl-ce2 button.btn:not(.secondary):not(.orange){background:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .lesson-header{background:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .lesson-header .num{color:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .sub-header .letter{background:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .cp-chip-edit{background:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .cp-eb:hover{border-color:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .cp-form{border-color:var(--accent-ce2);}
#view-chapitre.lvl-ce2 .cp-fig-handle{fill:rgba(85,139,47,.14);stroke:rgba(85,139,47,.5);}
.level-card.ce2{border-top-color:var(--accent-ce2);}
.level-card.ce2::before{background:radial-gradient(circle, rgba(85,139,47,.16), transparent 70%);}
.level-card.ce2 .lvl-new{background:var(--accent-ce2);}

/* ---- « Ma progression » : échelle de temps verticale (progression-editeur.js) ---- */
.pe-barre{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;margin:0 0 8px;}
.pe-total{display:inline-flex;align-items:center;gap:6px;font-size:.92rem;background:#EEF7F0;color:#1E5C30;border:1px solid #BFE0C8;border-radius:10px;padding:6px 12px;}
.pe-total.trop{background:#FDEEEC;color:#8A2E1C;border-color:#F2B8B0;}
.pe-outils{position:sticky;top:70px;z-index:6;display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:44px;background:rgba(253,249,246,.96);backdrop-filter:blur(4px);border:1px solid rgba(28,43,57,.1);border-radius:12px;padding:6px 12px;margin:0 0 12px;}
.pe-outils .btn{padding:4px 11px;font-size:.85rem;}
.pe-duree{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-family:'JetBrains Mono',monospace;font-size:.88rem;}
.pe-zone{position:relative;display:flex;max-width:820px;}
.pe-axe{position:relative;width:62px;flex:none;}
.pe-sem{position:absolute;left:0;right:0;border-top:1px solid rgba(28,43,57,.07);font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--ink-soft);padding:2px 8px 0 0;text-align:right;display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;}
.pe-sem.mois{border-top:2px solid rgba(28,43,57,.25);}
.pe-sem.mois b{font-family:'Space Grotesk',sans-serif;color:var(--ink);font-size:.75rem;text-transform:uppercase;letter-spacing:.03em;}
.pe-piste{position:relative;flex:1;border-left:2px solid rgba(28,43,57,.15);}
.pe-vac{position:absolute;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:.9rem;color:#fff;background:repeating-linear-gradient(135deg,#F08A24 0 12px,#E57A14 12px 24px);border-radius:10px;box-shadow:0 2px 6px rgba(229,122,20,.35);z-index:3;pointer-events:none;letter-spacing:.01em;}
.pe-vac .gicon{font-size:1.2rem;}
.pe-vac b{font-weight:800;}
.pe-vac-dates{font-weight:600;opacity:.92;background:rgba(255,255,255,.2);padding:2px 8px;border-radius:999px;font-size:.8rem;}
@media (max-width:600px){ .pe-vac{font-size:.78rem;gap:5px;} .pe-vac-dates{display:none;} }
.pe-fin{position:absolute;left:0;right:0;border-top:3px solid #1F3A5C;font-size:.76rem;font-weight:700;color:#1F3A5C;padding:2px 8px;z-index:1;}
.pe-hors{position:absolute;left:0;right:0;background:repeating-linear-gradient(135deg,rgba(179,38,30,.08) 0 8px,rgba(179,38,30,.16) 8px 16px);z-index:0;}
.pe-bloc{position:absolute;left:8px;right:8px;z-index:2;display:flex;gap:6px;align-items:flex-start;background:color-mix(in srgb, var(--c) 7%, #fff);border:1.5px solid color-mix(in srgb, var(--c) 45%, #fff);border-left:6px solid var(--c);border-radius:10px;box-shadow:0 1px 3px rgba(28,43,57,.08);padding:4px 8px 4px 4px;overflow:hidden;cursor:pointer;transition:top .18s ease, height .18s ease, box-shadow .15s;}
.pe-bloc:hover{box-shadow:0 3px 10px rgba(28,43,57,.14);}
.pe-bloc.sel{box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 35%, transparent), 0 4px 14px rgba(28,43,57,.16);z-index:3;}
.pe-bloc.tire{transition:none;z-index:5;opacity:.92;box-shadow:0 10px 24px rgba(28,43,57,.25);}
.pe-bloc:focus-visible{outline:3px solid var(--accent);outline-offset:1px;}
.pe-poignee{flex:none;cursor:grab;color:var(--ink-soft);font-size:1.05rem;line-height:1;padding:2px 3px;touch-action:none;user-select:none;}
.pe-poignee:active{cursor:grabbing;}
.pe-txt{flex:1;min-width:0;font-size:.86rem;line-height:1.2;}
.pe-txt b{font-family:'Space Grotesk',sans-serif;color:var(--ink);}
.pe-txt b.perso{color:var(--accent);}
.pe-code{font-family:'JetBrains Mono',monospace;font-size:.7rem;color:var(--ink-soft);}
.pe-dates{font-family:'JetBrains Mono',monospace;font-size:.72rem;color:var(--ink-soft);margin-top:1px;}
.pe-bloc.mini{align-items:center;padding-top:0;padding-bottom:0;}
.pe-bloc.mini .pe-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.78rem;}
.pe-bloc.mini .pe-dates{display:none;}
.pe-etirer{position:absolute;left:0;right:0;bottom:0;height:9px;cursor:ns-resize;touch-action:none;}
.pe-etirer::after{content:"";position:absolute;left:50%;bottom:2px;width:34px;height:4px;margin-left:-17px;border-radius:3px;background:color-mix(in srgb, var(--c) 55%, #fff);}
.pe-bloc:hover .pe-etirer::after, .pe-bloc.sel .pe-etirer::after{background:var(--c);}
@media (max-width:600px){ .pe-axe{width:46px;} .pe-bloc{left:4px;right:4px;} .pe-outils{top:60px;} }

/* Événements de la progression (voyage, semaine des maths…) */
.pe-bloc.evt{background:repeating-linear-gradient(135deg,#ECEFF1 0 10px,#E3E8EB 10px 20px);border-style:dashed;}
.pe-evt-ic{font-size:1rem;color:#546E7A;vertical-align:-3px;margin-right:2px;}
.tl-item.tl-evt{cursor:default;background:#ECEFF1;border-style:dashed;font-style:italic;}

/* Outil de correction : modalité de l'exercice (travail maison, classe entière, autonomie) */
.cor-modalites{gap:8px;align-items:center;}
.cor-mod{display:inline-flex;align-items:center;gap:5px;border:1.5px solid rgba(28,43,57,.15);border-radius:999px;padding:4px 12px;font-size:.85rem;cursor:pointer;background:#fff;}
.cor-mod .gicon{font-size:1.05rem;}
.cor-mod:has(input:checked){border-color:var(--accent-orange);background:rgba(255,130,8,.1);font-weight:600;}
.nb-modalite{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:.72rem;font-weight:600;vertical-align:middle;color:var(--c);background:color-mix(in srgb, var(--c) 10%, #fff);border:1px solid color-mix(in srgb, var(--c) 35%, #fff);}
.nb-modalite .gicon{font-size:.9rem;}
.nb-mod-choix{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 6px;}
.nb-mod-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:999px;font:600 .74rem inherit;font-family:inherit;cursor:pointer;color:#7A8492;background:#fff;border:1px dashed rgba(28,43,57,.25);}
.nb-mod-chip .gicon{font-size:.95rem;}
.nb-mod-chip:hover{color:var(--c);border-color:var(--c);}
.nb-mod-chip.on{color:#fff;background:var(--c);border:1px solid var(--c);}
@media print{ .nb-mod-chip:not(.on){display:none;} }
.nb-date-row .nb-resume-cor-btn{font-size:.78rem;padding:4px 10px;margin-left:auto;}
.nb-date-row:has(.nb-resume-cor-btn){display:flex;align-items:center;gap:10px;}
@media print{ .nb-resume-cor-btn{display:none !important;} }

/* Aide contextuelle des professeurs (aide.js) */
#aideBtn{position:fixed;left:18px;bottom:18px;z-index:9800;width:44px;height:44px;border-radius:50%;border:0;background:#0C5BA0;color:#fff;font:800 22px 'Space Grotesk',Arial,sans-serif;cursor:pointer;box-shadow:0 6px 18px rgba(12,91,160,.35);transition:transform .15s;}
#aideBtn:hover{transform:scale(1.08);}
#aideBtn[hidden]{display:none;}
#aideBulle{position:fixed;left:18px;bottom:74px;z-index:9800;width:min(300px, calc(100vw - 36px));background:#fff;border:1.5px solid rgba(12,91,160,.3);border-radius:14px;padding:12px 14px;box-shadow:0 12px 30px rgba(28,43,57,.2);display:flex;flex-direction:column;gap:6px;font-size:.88rem;animation:aideApparait .3s ease-out;}
#aideBulle::after{content:'';position:absolute;left:14px;bottom:-8px;width:14px;height:14px;background:#fff;border-right:1.5px solid rgba(12,91,160,.3);border-bottom:1.5px solid rgba(12,91,160,.3);transform:rotate(45deg);}
#aideBulle b{font-family:'Space Grotesk',Arial,sans-serif;color:#0C5BA0;}
#aideBulle div{display:flex;gap:8px;margin-top:4px;}
#aideBulle .btn{font-size:.8rem;padding:5px 12px;}
@keyframes aideApparait{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
#aideVoile{position:fixed;inset:0;z-index:9900;}
#aideTrou{position:fixed;border-radius:10px;box-shadow:0 0 0 9999px rgba(20,28,40,.55);outline:3px solid #FF8208;transition:all .3s ease;pointer-events:none;}
#aideCarte{position:fixed;background:#fff;border-radius:14px;padding:12px 16px 14px;box-shadow:0 14px 40px rgba(0,0,0,.3);transition:top .3s ease, left .3s ease;font-size:.92rem;line-height:1.45;}
#aideCarte h3{margin:6px 0 4px;font-family:'Space Grotesk',Arial,sans-serif;font-size:1.05rem;color:#20242E;}
#aideCarte p{margin:0 0 10px;color:#3A4250;}
.aide-tete{display:flex;align-items:center;gap:8px;font-size:.75rem;color:#7A8492;}
.aide-num{background:#FF8208;color:#fff;font-weight:700;border-radius:999px;padding:1px 8px;}
.aide-page{font-weight:600;}
.aide-x{margin-left:auto;border:0;background:none;font-size:1rem;color:#7A8492;cursor:pointer;}
.aide-pied{display:flex;justify-content:space-between;gap:8px;}
.aide-pied .btn{font-size:.82rem;padding:6px 12px;}
@media print{ #aideBtn, #aideBulle, #aideVoile{display:none !important;} }

/* Élève : niveaux qui ne sont pas les siens (niveauxMenusMaj) */
.niveau-masque{display:none !important;}

/* Blocs des outils de classe en survol, sur toutes les pages (classe.js : clSurvolBasculer) */
.cl-survol{position:fixed;z-index:8500;display:flex;resize:both;overflow:hidden;min-width:220px;min-height:170px;max-width:calc(100vw - 8px);max-height:calc(100vh - 8px);border-radius:16px;box-shadow:0 14px 38px rgba(28,43,57,.30);background:#fff;}
.cl-survol > .cl-bloc{position:relative;flex:1;min-width:0;box-sizing:border-box;overflow:auto;container-type:size;padding:10px 14px 16px;border:2px solid #1C2B39;border-radius:16px;}
.cl-survol .cl-titre-poignee{cursor:move;}
.cl-survol .cl-taille,.cl-survol .cl-masquer{display:none;}
.cl-survol .cl-bloc > p.hint{display:none;}
.cl-survol .cl-bloc h2{font-size:1rem;}
.cl-survol-saisi{opacity:.92;user-select:none;}
.cl-survol-btn{margin-left:auto;border:0;background:none;cursor:pointer;color:#0C5BA0;padding:2px;border-radius:6px;line-height:0;}
.cl-survol-btn:hover{background:rgba(12,91,160,.1);}
.cl-survol-btn + .cl-masquer{margin-left:0;}
.cl-bloc:fullscreen .cl-survol-btn{display:none;}
.cl-puce-survol{background:rgba(12,91,160,.1) !important;color:#0C5BA0 !important;}
@media print{ .cl-survol{display:none !important;} }

/* Pliage animé d'un patron (chapitres CM : cm1Pliage) */
.cm-pliage{text-align:center;}
.cmp-modeles{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:8px;}
.cmp-mod{border:1.5px solid rgba(28,43,57,.15);background:#fff;border-radius:999px;padding:4px 12px;font:600 .8rem 'Space Grotesk',sans-serif;cursor:pointer;color:#1F3A5C;}
.cmp-mod.on{background:#1F3A5C;color:#fff;border-color:#1F3A5C;}
.cmp-svg{width:100%;max-width:420px;height:280px;display:block;margin:0 auto;cursor:grab;touch-action:none;}
.cmp-barre{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;margin-top:6px;}
.cmp-barre input[type=range]{width:200px;}
.cmp-msg{min-width:220px;font-size:.9rem;}
.redaction-note .cm-pliage{background:#fff;border-radius:12px;padding:8px;margin-top:6px;}

/* Animations des cours de CM (chapitres/cm1/_anims.js) */
.cm-anim{text-align:center;}
.cma-ctrl .cmp-modeles{align-items:center;}
.cma-pm{display:inline-flex;align-items:center;gap:4px;font:600 .82rem 'Space Grotesk',sans-serif;color:#1F3A5C;margin:0 6px;}
.cma-pm button{width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(28,43,57,.2);background:#fff;font-weight:700;cursor:pointer;}
.cma-pm button:disabled{opacity:.35;cursor:default;}
.cma-pm b{min-width:20px;text-align:center;font-size:1rem;}
.cma-scene{min-height:120px;display:flex;align-items:center;justify-content:center;}
.cma-svg{width:100%;height:auto;display:block;margin:6px auto;}
.cma-texte{min-height:2.6em;margin:6px auto 0;max-width:640px;font-size:.98rem;line-height:1.45;color:#20242E;}
.cma-num{display:inline-block;background:#FF8208;color:#fff;border-radius:999px;padding:0 8px;font-size:.75rem;font-weight:700;margin-right:4px;}
.cma-saisie{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-bottom:6px;}
.cma-saisie input{width:110px;text-align:center;font:700 1.05rem 'JetBrains Mono',monospace;padding:6px;border-radius:8px;border:1.5px solid rgba(28,43,57,.2);}
.cma-saisie select{font:700 1.1rem 'JetBrains Mono',monospace;padding:5px 8px;border-radius:8px;}
.cma-op{border-collapse:collapse;margin:8px auto;}
.cma-op td{width:30px;height:30px;text-align:center;font:700 1.15rem 'JetBrains Mono',monospace;line-height:1;padding:2px 0;transition:background .3s;}
.cma-op td.cma-sg{color:#E35D3A;width:26px;}
.cma-op td.cma-ret{font-size:.72rem;color:#E35D3A;height:16px;}
.cma-op td.cma-res{color:#2E9C6A;}
.cma-op td.cma-fin{font-size:1.25rem;}
.cma-op td.cma-lab{width:auto;padding-left:14px;text-align:left;font:500 .8rem Inter,sans-serif;color:#5B6472;white-space:nowrap;}

/* Rédaction des réponses (cm1Redac, chapitres/cm1/_commun.js) : titre souligné, calcul (en ligne,
   ou « A = » en colonne avec le résultat encadré), puis phrase de conclusion. */
.cm-redac{margin:4px 0 14px;line-height:1.5;}
.cm-redac:last-child{margin-bottom:2px;}
.cm-redac-titre{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;font-weight:600;margin-bottom:4px;}
.cm-redac-ligne{margin:3px 0 3px 18px;}
.cm-redac-fig{margin:4px 0 6px 18px;max-width:100%;overflow-x:auto;}
.cm-redac-fig svg{max-width:100%;height:auto;}
.cm-redac-col{border-collapse:collapse;margin:2px 0 4px 18px;}
.cm-redac-col td{padding:2px 4px;vertical-align:middle;}
.cm-redac-col td:first-child{font-weight:600;padding-left:0;}
.cm-redac-pose{margin:2px 0 4px 18px;display:inline-block;}
.cm-redac-pose table{margin:4px 0 !important;}
.cm-encadre{display:inline-block;border:2px solid #1F3A5C;border-radius:3px;padding:1px 8px;font-weight:700;}
.cm-redac-phrase{margin:4px 0 0;}
.cm-liste{list-style:none;padding-left:4px;margin:6px 0;}
.cm-liste li{margin:7px 0;padding-left:16px;position:relative;}
.cm-liste li::before{content:'•';position:absolute;left:0;color:#E35D3A;font-weight:700;}
/* Fractions en LaTeX (cm1Frac) au primaire : un peu d'air au-dessus et au-dessous, pour que deux
   lignes contenant des fractions en étage ne se touchent pas. */
.lvl-ce2 span.tex, .lvl-cm span.tex, .lvl-cm2 span.tex, .quiz-q span.tex, .fp-modal .katex{display:inline-block;margin:3px 0;}

/* Cahier : lien « Revoir dans le cours » sur une partie de cours */
.nb-cours-lien{display:inline-flex;align-items:center;gap:4px;margin:2px 0 6px;border:1.5px solid var(--accent-blue,#0C5BA0);background:#fff;color:var(--accent-blue,#0C5BA0);border-radius:999px;padding:3px 11px;font-weight:700;font-size:.82rem;cursor:pointer;}
.nb-cours-lien .gicon{font-size:17px;}
.nb-vivant-btn{margin-left:6px;border-color:#1F7A4D;color:#1F7A4D;}
@media print{ .nb-cours-lien{display:none;} }

/* Outils du chapitre : une ligne, des couleurs (Personnaliser, Suggérer, Exporter en PDF, Planches, Questions flash) */
.chap-outils{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:8px 0 16px;}
.chap-outils .cp-bar{margin:0;}
.chap-outils #chapSuggestRow{margin:0;}
.chap-export{display:inline-flex;align-items:center;gap:8px;}
#view-chapitre:not([data-onglet="cours"]) .chap-export{display:none;}
.btn.secondary.cp-btn{background:#EEF4FB;border-color:#B9CFE8;color:#2A5A8C;}
.btn.secondary.chap-btn-sugg{background:#FFF6E5;border-color:#F2CD86;color:#8A5A00;}
.btn.secondary.chap-btn-pdf{background:#FDEEE9;border-color:#F3B7A6;color:#B3452C;}
.btn.secondary.pl-bouton{background:#EAF7EF;border-color:#9ED3B4;color:#1F7A4D;}
.btn.secondary.fp-bouton{background:#F4F0FC;border-color:#C9B5EE;color:#5B3A99;}
.chap-outils .btn.secondary:hover, .btn.secondary.pl-bouton:hover, .btn.secondary.fp-bouton:hover{filter:brightness(.97);}

/* Dessin d'une correction rédigée placé à droite du texte (planches) */
.cm-fig-d{ float:right; margin:0 0 2px 8px; } .cm-fig-d svg{ max-width:none !important; } .cm-redac::after{ content:''; display:block; clear:both; }

/* Méthode pas à pas avec un dessin qui évolue à chaque étape */
.step-avec-fig{ display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.step-avec-fig > .step-column{ flex:1 1 260px; }
.step-fig{ flex:0 1 auto; max-width:100%; text-align:center; }
.step-fig svg{ max-width:100%; height:auto; }
/* Cahier : vue par semaine (app.js, nbSemaineRendre) */
.nbs-tete{display:flex;align-items:center;gap:10px;margin:0 0 12px;}
.nbs-titre{flex:1;text-align:center;font:800 1.15rem 'Space Grotesk',sans-serif;color:var(--ink,#1C2B39);}
.nbs-titre::first-letter{text-transform:uppercase;}
.nbs-nav{display:inline-flex;align-items:center;gap:2px;border:1.5px solid rgba(28,43,57,.18);background:#fff;border-radius:999px;padding:5px 12px;font:700 .85rem 'Space Grotesk',sans-serif;color:var(--accent-blue,#0C5BA0);cursor:pointer;}
.nbs-nav:disabled{opacity:.35;cursor:default;} .nbs-nav .gicon{font-size:20px;}
.nbs-vignettes{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;max-width:100%;}
@media (min-width:900px){ .nbs-vignettes{grid-template-columns:repeat(auto-fit,minmax(140px,calc((100% - 50px) / 6)));} }
.nbs-vig{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:1.5px solid rgba(28,43,57,.14);background:#fff;border-radius:14px;padding:10px 12px 26px;cursor:pointer;font:inherit;color:var(--ink,#1C2B39);box-shadow:0 2px 8px rgba(28,43,57,.05);transition:transform .12s, box-shadow .12s;min-height:118px;}
.nbs-vig:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(28,43,57,.1);}
.nbs-vig.on{border-color:var(--accent-blue,#0C5BA0);background:#EEF4FB;box-shadow:inset 0 0 0 1px var(--accent-blue,#0C5BA0);}
.nbs-j{font:800 1rem 'Space Grotesk',sans-serif;text-transform:capitalize;} .nbs-d{font-size:.82rem;color:var(--ink-soft,#5B6472);}
.nbs-chap{font-size:.78rem;line-height:1.3;color:#1F3A5C;font-weight:600;margin-top:4px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.nbs-n{display:flex;gap:4px;flex-wrap:wrap;font-size:.72rem;margin-top:auto;padding-top:4px;color:var(--ink-soft,#5B6472);}
.nbs-c,.nbs-e{border-radius:999px;padding:0 7px;font-weight:700;} .nbs-c{background:#E3F2EA;color:#1F7A4D;} .nbs-e{background:#FDEDE5;color:#B4471F;}
.nbs-vig > .gicon{position:absolute;right:8px;bottom:5px;font-size:20px;color:var(--ink-soft,#5B6472);}
.nbs-vig .nb-oliv-cours{position:absolute;top:14px;right:8px;margin:0;} .nbs-vig .nb-oliv-cours::after{display:none;}
.nbs-panneau{margin-top:14px;border-top:3px solid var(--accent-blue,#0C5BA0);padding-top:10px;}
.nbs-panneau .nb-page-footer{text-align:right;font-style:italic;color:var(--ink-soft,#5B6472);font-size:.9em;margin:6px 0 14px;}
.nbs-p-tete{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-family:'Space Grotesk',sans-serif;font-size:1.05rem;}
@media (max-width:600px){ .nbs-nav-t{display:none;} .nbs-titre{font-size:1rem;} .nbs-vignettes{grid-template-columns:repeat(2,1fr);} }
@media print{ .nbs-tete,.nbs-vignettes{display:none;} }
.nb-cahier-de{display:flex;gap:6px;align-items:center;background:#EEF4FB;color:#1F3A5C;border-radius:10px;padding:6px 12px;margin:0 0 12px;font-size:.9rem;} .nb-cahier-de .gicon{font-size:18px;}

/* ---------- Listes déroulantes : un même style partout -- demandé : « Pour les listes déroulantes
   partout, les rendre plus sexy ». Bord arrondi, flèche dessinée, survol et focus colorés. :where()
   garde une spécificité nulle : les réglages propres à une liste (taille, police, largeur) l'emportent. */
:where(select:not([multiple]):not([size])){
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%230C5BA0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 11px center; background-size:12px 8px;
  border:1.5px solid rgba(28,43,57,.18); border-radius:10px;
  padding:7px 34px 7px 12px; min-height:36px;
  font-family:'Inter',sans-serif; font-size:.9rem; font-weight:600; color:var(--ink,#20242E); line-height:1.3;
  cursor:pointer; box-shadow:0 1px 2px rgba(28,43,57,.06);
  transition:border-color .15s, box-shadow .15s, background-color .15s;
  max-width:100%; text-overflow:ellipsis;
}
:where(select:not([multiple]):not([size])):hover{ border-color:var(--accent,#0C5BA0); background-color:#F7FAFE; }
:where(select:not([multiple]):not([size])):focus{ outline:none; border-color:var(--accent,#0C5BA0); box-shadow:0 0 0 3px rgba(12,91,160,.18); }
:where(select:not([multiple]):not([size])):disabled{ opacity:.55; cursor:not-allowed; background-color:#F3F5F8; }
:where(select) option{ font-weight:500; color:#20242E; background:#fff; }
:where(select) optgroup{ font-weight:800; color:var(--accent,#0C5BA0); }
/* La flèche et sa place ne doivent pas être écrasées par un « padding » ou un fond propre à une liste. */
select:not([multiple]):not([size]){
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%230C5BA0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 11px center; background-size:12px 8px;
  padding-right:34px;
}
@media print{ select:not([multiple]):not([size]){ background-image:none; box-shadow:none; padding-right:12px; } }
/* Champs de date et d'heure : même habillage que les listes. */
:where(input[type=date], input[type=time], input[type=datetime-local], input[type=month], input[type=week]){
  background-color:#fff; border:1.5px solid rgba(28,43,57,.18); border-radius:10px; padding:6px 10px; min-height:36px;
  font-family:'Inter',sans-serif; font-size:.9rem; font-weight:600; color:var(--ink,#20242E);
  box-shadow:0 1px 2px rgba(28,43,57,.06); transition:border-color .15s, box-shadow .15s; box-sizing:border-box; max-width:100%;
}
:where(input[type=date], input[type=time], input[type=datetime-local], input[type=month], input[type=week]):hover{ border-color:var(--accent,#0C5BA0); }
:where(input[type=date], input[type=time], input[type=datetime-local], input[type=month], input[type=week]):focus{ outline:none; border-color:var(--accent,#0C5BA0); box-shadow:0 0 0 3px rgba(12,91,160,.18); }
:where(input[type=date], input[type=time], input[type=datetime-local])::-webkit-calendar-picker-indicator{ cursor:pointer; opacity:.7; }

/* Géométrie interactive : menu du clic droit (trace d'un objet, outils-figures.js). */
#figMenuCtx{position:fixed;z-index:10050;background:#fff;border:1px solid rgba(28,43,57,.15);border-radius:10px;box-shadow:0 10px 28px rgba(28,43,57,.2);padding:4px;min-width:200px;font-size:.9rem;}
#figMenuCtx .fig-mc-t{padding:6px 10px 4px;font:700 .78rem 'Space Grotesk',sans-serif;color:var(--ink-soft,#5B6472);}
#figMenuCtx .fig-mc-t::first-letter{text-transform:uppercase;}
#figMenuCtx button{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;border-radius:7px;padding:7px 10px;font:inherit;color:var(--ink,#1C2B39);cursor:pointer;text-align:left;}
#figMenuCtx button:hover{background:#EEF4FB;}
#figMenuCtx .gicon{font-size:18px;color:var(--accent-blue,#0C5BA0);}
#figMenuCtx .fig-mc-s{padding:6px 10px 2px;font-size:.72rem;font-weight:700;color:var(--ink-soft,#5B6472);text-transform:uppercase;letter-spacing:.04em;border-top:1px solid rgba(28,43,57,.08);margin-top:4px;}
#figMenuCtx .fig-mc-choix{display:flex;gap:4px;padding:3px 10px;}
#figMenuCtx .fig-mc-choix button{width:auto;flex:1;justify-content:center;border:1px solid rgba(28,43,57,.18);padding:4px 8px;border-radius:7px;}
#figMenuCtx .fig-mc-choix button.on{background:var(--accent-blue,#0C5BA0);color:#fff;border-color:var(--accent-blue,#0C5BA0);}
#figMenuCtx .fig-mc-couleurs{display:flex;flex-wrap:wrap;gap:6px;padding:4px 10px 6px;}
#figMenuCtx .fig-mc-couleurs button{width:22px;height:22px;padding:0;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(28,43,57,.25);justify-content:center;}
#figMenuCtx .fig-mc-couleurs button.on{box-shadow:0 0 0 2.5px var(--accent-blue,#0C5BA0);}
#figMenuCtx .fig-mc-couleurs .fig-mc-auto{background:#fff;font-size:.7rem;font-weight:800;color:var(--ink-soft,#5B6472);}
#figMenuCtx .fig-mc-anim{font-weight:700;} #figMenuCtx .fig-mc-anim .gicon{color:#1F7A4D;}
#figMenuCtx .fig-mc-note{display:flex;gap:6px;align-items:flex-start;padding:6px 10px;font-size:.78rem;color:var(--ink-soft,#5B6472);max-width:260px;line-height:1.35;}
#figMenuCtx .fig-mc-note .gicon{font-size:16px;color:var(--ink-soft,#5B6472);}
#figMenuCtx .fig-mc-suppr{color:#C0392B;border-top:1px solid rgba(28,43,57,.08);border-radius:0 0 7px 7px;margin-top:4px;}
#figMenuCtx .fig-mc-suppr .gicon{color:#C0392B;}

/* Figure dynamique dans le cahier (outils-figures.js : figDynActiver). */
.fig-dyn{position:relative;}
.fig-dyn-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;margin:2px 0 6px;font-size:.82rem;}
.fig-dyn-tag{display:inline-flex;align-items:center;gap:4px;color:#7A4FC0;font-weight:700;margin-right:4px;}
.fig-dyn-tag .gicon{font-size:17px;}
.fig-dyn-bar button{display:inline-flex;align-items:center;gap:4px;border:1px solid rgba(122,79,192,.35);background:#fff;color:#5A3596;border-radius:999px;padding:3px 10px;font:inherit;font-weight:700;cursor:pointer;}
.fig-dyn-bar button:hover{background:#F3EEFB;}
.fig-dyn-choix{display:inline-flex;align-items:center;gap:4px;color:#5A3596;font-weight:600;}
.fig-dyn-choix button{padding:2px 10px;min-width:32px;justify-content:center;}
.fig-dyn-choix button.on{background:#7A4FC0;color:#fff;border-color:#7A4FC0;}
.fig-dyn-bar button .gicon{font-size:17px;}
#figValidateBtn[style*="display: none"] + #figValidateDynBtn, #figValidateBtn[style*="display:none"] + #figValidateDynBtn{display:none !important;}
@media print{ .fig-dyn-bar{display:none !important;} }

/* Mes figures enregistrées (devoirs.js : openSandboxFiguresModal). */
.fig-liste-l{display:grid;grid-template-columns:120px 1fr;grid-template-areas:"ap t" "ap act";gap:4px 12px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(28,43,57,.08);}
.fig-liste-l.ouverte .fig-liste-ouvrir{border-color:#7A4FC0;box-shadow:0 0 0 2px rgba(122,79,192,.25);}
.fig-liste-ouvrir{grid-area:ap;width:120px;height:77px;padding:0;border:1px solid rgba(28,43,57,.15);border-radius:8px;background:#fff;cursor:pointer;overflow:hidden;}
.fig-liste-ouvrir:hover{border-color:var(--accent-blue,#0C5BA0);}
.fig-liste-ap{width:100%;height:100%;display:block;}
.fig-liste-t{grid-area:t;display:flex;flex-direction:column;gap:1px;} .fig-liste-t small{color:var(--ink-soft,#5B6472);font-size:.78rem;}
.fig-liste-act{grid-area:act;display:flex;gap:6px;flex-wrap:wrap;}
.fig-liste-act .btn{font-size:.78rem;padding:4px 10px;}
.fig-liste-act .fig-liste-eff{color:#A83C1F;}
@media (max-width:520px){ .fig-liste-l{grid-template-columns:90px 1fr;} .fig-liste-ouvrir{width:90px;height:58px;} }

/* ===== L'Atelier du Prof (adp.latelieraugmente.fr, adp.js) : le même site sans les contenus de maths ===== */
.mode-adp #navLinks [data-nav="niveau"], .mode-adp #navDropdownEntrainer, .mode-adp #navLinks [data-nav="progression"],
.mode-adp #navFamille, .mode-adp #navLinks [data-nav="evaluation"],
.mode-adp #view-home > :not(#adpAccueil):not(#profHomeDigest),
.mode-adp .cd-ajout[onclick^="cxProfAjouterCours"],
.mode-adp .cx-onglets button[data-o="man"], .mode-adp .cx-onglets button[data-o="prog"], .mode-adp .cx-onglets button[data-o="fig"],
.mode-adp .devoir-type-btn:not([onclick*="'fichier'"]),
.mode-adp label:has(> #qzGenChap),
.mode-adp #corNiveau,
.mode-adp .sup-tab-btn[data-suptab="resultats"], .mode-adp #navMesResultats,
.mode-adp .tool-icon-btn[onclick*="openFigureTool"], .mode-adp .tool-icon-btn.outil-figdyn, .mode-adp .tool-icon-btn.outil-instruments,
.mode-adp .tool-icon-btn[onclick*="openDivisionTool"], .mode-adp .tool-icon-btn[onclick*="openAdditionTool"],
.mode-adp .tool-icon-btn[onclick*="openAxeTool"], .mode-adp .tool-icon-btn[onclick*="openDisqueTool"],
.mode-adp .tool-icon-btn[onclick*="openCubesTool"], .mode-adp .tool-icon-btn[onclick*="openUrnTool"],
.mode-adp .tool-icon-btn[onclick*="openGeoAnimTool"]{ display:none !important; }
.mode-adp .brand .adp-nom{ font:800 1.12rem Montserrat,'Space Grotesk',sans-serif; color:#173F70; letter-spacing:-.01em; white-space:nowrap; }
.mode-adp .brand .adp-nom b{ color:#F29A1F; font-weight:800; }
#adpAccueil{ padding:8px 0 24px; }
.adp-hero{ display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:28px; align-items:center; background:#FBFAF5; border:1px solid rgba(23,63,112,.1); border-radius:18px; padding:28px 32px; }
.adp-hero h1{ font:800 clamp(1.7rem,3.4vw,2.5rem)/1.15 Montserrat,'Space Grotesk',sans-serif; color:#173F70; margin:6px 0 12px; }
.adp-hero h1 em{ font-style:normal; color:#F29A1F; }
.adp-hero p{ color:var(--ink-soft); margin:0 0 18px; max-width:62ch; }
.adp-hero img{ width:100%; max-width:220px; justify-self:center; }
.adp-devise{ font:700 .74rem Montserrat,'Space Grotesk',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#C9700A; background:rgba(242,154,31,.13); padding:4px 11px; border-radius:999px; }
.adp-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.adp-tuiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; margin-top:20px; }
.adp-tuile{ display:flex; flex-direction:column; gap:6px; text-align:left; background:#fff; border:1.5px solid rgba(23,63,112,.12); border-radius:14px; padding:16px 18px; cursor:pointer; font:inherit; color:var(--ink); box-shadow:0 2px 8px rgba(23,63,112,.05); }
.adp-tuile:hover{ border-color:#1F5FA8; transform:translateY(-1px); }
.adp-tuile .gicon{ font-size:26px; color:#1F5FA8; }
.adp-tuile b{ font:700 1rem Montserrat,'Space Grotesk',sans-serif; color:#173F70; }
.adp-tuile small{ color:var(--ink-soft); font-size:.85rem; line-height:1.45; }
.adp-maths{ margin-top:18px; font-size:.9rem; color:var(--ink-soft); }
@media (max-width:700px){ .adp-hero{ grid-template-columns:1fr; padding:20px; } .adp-hero img{ max-width:150px; grid-row:1; } }

/* Encadré « À apprendre » ([[...]] dans l'outil de correction) : une définition du cours, avec son étiquette. */
.def-box.lecon-box{ margin:8px 0; }
.def-box.lecon-box::before{ content:'À apprendre'; display:block; font:700 .7rem 'Space Grotesk',sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#B8511F; margin-bottom:4px; }
.fmt-btn.fmt-lecon{ width:auto; padding:0 10px; display:inline-flex; align-items:center; gap:4px; font:600 .8rem Inter,sans-serif; }
.fmt-btn.fmt-lecon .gicon{ font-size:16px; }
.adp-test{ display:flex; gap:12px; align-items:flex-start; background:#FFF6E8; border:1px solid rgba(242,154,31,.4); border-radius:14px; padding:16px 18px; max-width:70ch; }
.adp-test > .gicon{ font-size:28px; color:#C9700A; }
.adp-test p{ margin:6px 0 0; color:var(--ink-soft); }
/* Cahier de l'élève : un cahier par professeur (onglets par matière). */
.nb-profs{ display:flex; gap:6px; flex-wrap:wrap; margin:0 0 12px; }
.nb-prof{ border:1.5px solid rgba(28,43,57,.15); background:#fff; border-radius:999px; padding:6px 14px; font:700 .88rem 'Space Grotesk',sans-serif; color:var(--ink); cursor:pointer; }
.nb-prof.on{ background:var(--accent); border-color:var(--accent); color:#fff; }