@import url("jetons.css");  /* les jetons de couleur, source unique (N°326) */
/* Les polices du style identité (N°342) : servies par le site, jamais par Google. */
@font-face{font-family:"Marcellus SC";src:url("../fonts/MarcellusSC-Regular.ttf") format("truetype");font-display:swap;}
@font-face{font-family:"Source Serif 4";src:url("../fonts/SourceSerif4-Regular.ttf") format("truetype");font-weight:400;font-display:swap;}
@font-face{font-family:"Source Serif 4";src:url("../fonts/SourceSerif4-Semibold.ttf") format("truetype");font-weight:500 800;font-display:swap;}
@font-face{font-family:"Source Serif 4";src:url("../fonts/SourceSerif4-Italic.ttf") format("truetype");font-style:italic;font-display:swap;}
*{box-sizing:border-box}
[hidden]{display:none!important;}  /* l'attribut `hidden` prime sur un `display` de classe */
body{margin:0;font:14px/1.5 var(--police-texte);color:var(--ink);background:var(--bg);}
a{color:var(--accent)}

/* ---------- Layout + sidebar ---------- */
.layout{display:flex;min-height:100vh;}
.sidebar{width:var(--sb-w);background:var(--sb-bg);color:var(--sb-text);display:flex;flex-direction:column;
  transition:width .15s ease;flex:0 0 auto;}
.sidebar.collapsed{width:var(--sb-w-min);}

.sb-head{display:flex;align-items:center;gap:10px;padding:16px 14px;color:var(--blanc);min-height:60px;}
.sb-logo{width:32px;height:32px;border-radius:8px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;flex:0 0 32px;}
.sb-title{font-weight:600;white-space:nowrap;overflow:hidden;}

.nav{flex:1;padding:6px 0;overflow-y:auto;}
.sb-section{padding:14px 16px 4px;font-size:11px;letter-spacing:.08em;color:var(--sb-muted);text-transform:uppercase;white-space:nowrap;overflow:hidden;}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 16px;color:var(--sb-text);text-decoration:none;white-space:nowrap;border-left:3px solid transparent;}
.nav a:hover{background:var(--sb-hover);color:var(--blanc);}
.nav a.active{background:var(--sb-hover);color:var(--blanc);border-left-color:var(--sb-active);}
.nav .ico{width:22px;text-align:center;flex:0 0 22px;font-size:16px;line-height:0;}
.nav a svg.ico{width:18px;height:18px;vertical-align:middle;}

.sb-toggle{background:none;border:none;color:var(--sb-text);cursor:pointer;padding:10px;text-align:center;width:100%;font-size:18px;line-height:1;}
.sb-toggle:hover{color:var(--blanc);background:var(--sb-hover);}

.sb-foot{border-top:1px solid var(--sb-hover);padding:8px 0;display:flex;flex-direction:column;gap:1px;}
.sb-foot-id{display:flex;align-items:center;gap:10px;padding:4px 16px 8px;}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-weight:600;flex:0 0 32px;}
.user-meta{overflow:hidden;min-width:0;}
.user-meta .nm{color:var(--blanc);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* Actions du pied (Mon compte / Déconnexion) — même allure que les liens de nav. */
.sb-action{display:flex;align-items:center;gap:12px;padding:9px 16px;width:100%;background:none;border:none;
  border-left:3px solid transparent;color:var(--sb-text);font:inherit;text-align:left;text-decoration:none;cursor:pointer;}
.sb-action:hover{background:var(--sb-hover);color:var(--blanc);}
.sb-action.active{background:var(--sb-hover);color:var(--blanc);border-left-color:var(--sb-active);}
.sb-ico{flex:0 0 22px;display:flex;align-items:center;justify-content:center;}
.sb-foot form{margin:0;}

/* repliée : on ne montre que les icônes (libellés masqués) — le détail s'affiche via infobulle au survol */
.sidebar.collapsed .sb-title,
.sidebar.collapsed .sb-section,
.sidebar.collapsed .nav-label,
.sidebar.collapsed .user-meta{display:none;}
/* repliée : avatar + actions du pied centrés (icônes seules, détail via infobulle) */
.sidebar.collapsed .sb-foot-id,
.sidebar.collapsed .sb-action{justify-content:center;padding-left:0;padding-right:0;}

/* Infobulle de la sidebar repliée : positionnée en `position:fixed` par sidebar.js
   → échappe à l'`overflow` du `.nav` (qui sinon rognerait une infobulle CSS classique). */
.sb-tip{position:fixed;z-index:1000;background:var(--nuit);color:var(--blanc);font-size:12.5px;line-height:1;
  padding:7px 10px;border-radius:6px;white-space:nowrap;pointer-events:none;
  box-shadow:0 2px 8px var(--ombre-3);transform:translateY(-50%);opacity:0;transition:opacity .12s ease;}
.sb-tip.show{opacity:1;}

/* ---------- Main ---------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:3px 24px;border-bottom:1px solid var(--ombre-2);background:var(--bandeau);}
/* Le nom de la page DOMINE le chemin qui y mène : c'est l'information, le fil
   n'est que le contexte. Sans ça le dernier maillon (blanc, gras, juste
   au-dessus) l'écrasait — et l'écran redevenait ambigu. */
.topbar h1{margin:0;font-size:15px;font-weight:700;color:var(--bandeau-txt);}
.content{padding:24px;flex:1;}

/* ---------- Composants ---------- */
.card{background:var(--card);border-radius:10px;box-shadow:0 1px 3px var(--ombre-1);padding:18px;}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;}
/* Empilement vertical de blocs (`.card`) : l'espacement STANDARD du site — 14 px,
   la même valeur que `.classe-grille` et `.cfg-grid`. `.card` n'a pas de marge
   propre (elle gênerait dans une grille) : c'est le CONTENEUR qui espace. Une
   page qui empile des cartes utilise `.pile`, sinon elles se touchent. */
.pile{display:flex;flex-direction:column;gap:14px;}
.muted{color:var(--muted);}
/* Ligne SECONDAIRE (sous-titre de carte, cellule d'appoint, compteur) : elle
   était écrite dans 13 templates et définie nulle part — 53 textes annoncés
   comme secondaires s'affichaient en noir plein. `.muted` ne fait que la
   couleur ; ici on veut aussi la taille, c'est ce qui distingue les deux.
   Toutes les `.sub` du site sont sur fond blanc (vérifié) : --muted #5f6673
   sur --card #fff ≈ 5,9:1, au-dessus du 4,5:1 exigé (WCAG AA). */
.sub{color:var(--muted);font-size:13px;}
/* Les portes d'une ligne de tableau (« Mon école » / « Administrer ») : à
   droite, groupées, sans faire grandir la ligne. */
.dash-portes{display:flex;gap:6px;justify-content:flex-end;white-space:nowrap;}

.btn{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:var(--blanc);border:none;border-radius:8px;padding:9px 16px;font:inherit;cursor:pointer;text-decoration:none;}
.btn:hover{background:var(--accent-dark);}
.btn-secondary{background:var(--card);color:var(--ink);border:1px solid var(--line);}
.btn-secondary:hover{background:var(--fond-gris);}
.btn-danger{background:var(--danger);}
.btn-danger:hover{background:var(--danger);}
.btn-sm{padding:5px 10px;font-size:13px;}
.btn-xs{padding:1px 8px;font-size:14px;line-height:1.3;border-radius:6px;}
.btn:disabled{opacity:.5;cursor:not-allowed;}

/* Tableau simple (liste d'élèves…) */
.table{width:100%;border-collapse:collapse;font-size:14px;}
.table th,.table td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);}
.table th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.04em;}
.table tbody tr:hover{background:var(--fond-doux);}
/* Colonnes Nom/Prénom figées pendant le défilement horizontal */
.table .fige{position:sticky;background:var(--card);z-index:1;}
.table thead .fige{z-index:2;}
.table tbody tr:hover .fige{background:var(--fond-doux);}
.table .fige-1{left:0;}
.table .fige-2{left:130px;box-shadow:1px 0 0 var(--line);}
.table .fige-1,.table .fige-2{min-width:130px;}

/* Configuration Répartition : listes d'items + lignes d'ajout */
.cfg-list{list-style:none;margin:0 0 .8em;padding:0;display:flex;flex-direction:column;gap:4px;}
.cfg-list li{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:6px 10px;background:var(--fond-doux);border:1px solid var(--line);border-radius:8px;}
.cfg-list form{margin:0;}
.cfg-add{display:flex;align-items:center;gap:8px;margin-top:.4em;
  padding-top:.8em;border-top:1px solid var(--line);}
/* Classes : 3 zones par ligne (réordonner · infos · actions). */
.cfg-classes li{gap:6px;}
.cfg-reorder{display:flex;gap:3px;flex:0 0 auto;}
.cfg-classe-info{flex:1;min-width:0;}
.cfg-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto;}
.classe-champs{display:flex;gap:12px;flex-wrap:wrap;}
.classe-champs label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;}
.btn:disabled{opacity:.4;cursor:default;}
/* Catalogue de paramètres : une ligne = case à cocher + importance */
.cfg-params{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.cfg-params li{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 10px;background:var(--fond-doux);border:1px solid var(--line);border-radius:8px;}
.param-actif{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;color:var(--ink);cursor:pointer;flex:1;}
.param-actif input{flex:none;}
.cfg-params li select{width:150px;flex:none;}

label{display:block;font-size:13px;color:var(--ink-2);margin:10px 0 4px;}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],select,textarea{
  padding:9px 11px;border:1px solid var(--line-fort);border-radius:8px;font:inherit;background:var(--card);}
/* largeur pleine pour les champs texte + listes ; les champs nombre/date gardent
   une largeur intrinsèque (sinon, enfants flex directs, ils cassent les lignes inline).
   La zone de texte est un champ comme les autres (capteur : test_composants_du_site.py). */
input[type=text],input[type=email],input[type=password],select,textarea{width:100%;box-sizing:border-box;}
textarea{resize:vertical;line-height:1.4;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);}

/* La LISTE DU SITE (liste.js, chargé par base.html ; 25/10/2026) : tout <select> garde son champ (valeur,
   envoi, scripts), mais s'ouvre sur le menu du site (`.entete-pop`), jamais sur le menu gris du système.
   Fermé : le champ du site, chevron ▾ du site à droite (sélecteur renforcé : il passe devant les
   variantes compactes des pages, qui ne règlent que taille et marges). Capteur : test_composants_du_site.py. */
select:not([multiple]):not([size]){-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:28px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%236b7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:10px 6px;}
select[aria-expanded="true"]{border-color:var(--accent);}
select:disabled{cursor:not-allowed;opacity:.6;}
.liste-pop{position:fixed;z-index:1000;font-size:13.5px;overflow:auto;padding:5px;inset:auto;margin:0;}  /* popover : sans le centrage du navigateur */
.liste-pop button[role="option"]{display:block;width:100%;border:0;background:none;font:inherit;text-align:left;cursor:pointer;
  padding:6px 10px 6px 26px;border-radius:6px;color:var(--ink);white-space:normal;line-height:1.35;position:relative;}
.liste-pop button[role="option"]:hover,.liste-pop button[role="option"]:focus-visible{background:var(--accent-pale);outline:none;}
.liste-pop button[aria-selected="true"]{color:var(--accent);font-weight:700;}
.liste-pop button[aria-selected="true"]::before{content:'✓';position:absolute;left:9px;}
.liste-pop button[role="option"]:disabled{color:var(--muted);cursor:default;background:none;}
.liste-pop .liste-groupe{padding:8px 10px 3px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.liste-pop .liste-groupe:first-child{padding-top:3px;}
.form-error{color:var(--danger);font-size:12px;margin-top:3px;}
.form-row{margin-bottom:6px;}

/* ---------- Page « Mon compte » ---------- */
.compte-page{max-width:560px;display:flex;flex-direction:column;gap:18px;}
.compte-page .card-titre{margin:0 0 12px;font-size:15px;}
.compte-page .card.card-danger{border:1px solid var(--danger);}
/* Accès de Claude (ADR-0016) : maquette planification/maquettes/acces_claude_compte_2026-10-28.html */
.compte-page .ac-etat{margin:0 0 4px;}
.compte-page .ac-espace{margin-top:12px;}
.compte-page .ac-bientot{color:var(--alerte-texte);}
.compte-page .ac-ligne{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px;}
.compte-page .ac-ligne form{margin:0;}
.compte-page .ac-jeton{font-family:ui-monospace,Menlo,monospace;font-size:13px;flex:1;min-width:220px;width:auto;}
.compte-page .ac-code{display:block;font-family:ui-monospace,Menlo,monospace;font-size:12px;padding:6px 8px;
  border:1px solid var(--line);border-radius:6px;margin:6px 0 0;white-space:pre-wrap;}
.form-check{display:flex;align-items:center;gap:8px;margin:8px 0 12px;}
.form-check input{width:auto;}

/* ---------- Feedback ---------- */
.feedback-dialog{max-width:420px;}
.fb-soustitre{margin:.2em 0 12px;}
.fb-stars{display:flex;gap:4px;margin-bottom:12px;}
.fb-star{background:none;border:none;cursor:pointer;font-size:30px;line-height:1;color:var(--line);padding:0 2px;transition:color .1s;}
.fb-star:hover,.fb-star.on{color:var(--alerte);}
.fb-message{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;resize:vertical;}
.fb-invite{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--fond-gris);border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin-bottom:16px;}
.fb-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(10px);
  background:var(--nuit);color:var(--blanc);padding:10px 18px;border-radius:8px;box-shadow:0 4px 16px var(--ombre-3);
  opacity:0;transition:opacity .2s,transform .2s;z-index:2000;pointer-events:none;}
.fb-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
@media print{.fb-invite{display:none;}}

/* ---------- Admin / stats ---------- */
.admin-stats{display:flex;flex-direction:column;gap:18px;}
.stat-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));}
.stat{text-align:center;}
.stat-num{font-size:28px;font-weight:700;color:var(--ink);line-height:1.1;}
.stat-lbl{font-size:12px;color:var(--muted);margin-top:4px;}
.admin-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;}
.kv{list-style:none;margin:0;padding:0;}
.kv li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid var(--line);font-size:14px;}
.kv li:last-child{border-bottom:none;}
.kv li b{color:var(--ink);}
.table-scroll{overflow-x:auto;}
.admin-table{width:100%;border-collapse:collapse;font-size:13px;}
.admin-table th,.admin-table td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap;}
.admin-table th{color:var(--muted);font-weight:600;}
.admin-table .r-num{text-align:right;}
.checkbox{display:flex;align-items:center;gap:8px;margin:12px 0;}
.checkbox input{width:auto;}

.flash-success{background:var(--ok-fond);color:var(--ok-texte);border:1px solid var(--ok-bord);}
.flash-error{background:var(--danger-fond);color:var(--danger-texte);border:1px solid var(--danger-bord);}
.flash-info{background:var(--accent-pale);color:var(--nuit);border:1px solid var(--accent-bord);}
.flash-warning{background:var(--alerte-fond);color:var(--alerte-texte);border:1px solid var(--alerte-bord);}
/* Toasts (messages flash) : fixés en bas, glissent depuis le bas, croix + auto-fermeture.
   Les couleurs viennent des classes .flash-* ci-dessus. */
.toast-zone{position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:2000;
  width:min(560px,94vw);padding:0 12px 24px;display:flex;flex-direction:column;gap:8px;
  align-items:stretch;pointer-events:none;}
.toast{position:relative;overflow:hidden;cursor:pointer;pointer-events:auto;display:flex;
  align-items:center;gap:12px;padding:11px 15px;border-radius:10px;font-size:14px;
  box-shadow:0 8px 28px var(--ombre-2);
  transform:translateY(140%);opacity:0;transition:transform .28s ease,opacity .28s ease;}
.toast.show{transform:translateY(0);opacity:1;}
.toast.epingle{cursor:default;}
.toast-msg{flex:1;}
/* Barre de progression (compte à rebours) : se vide de la droite vers la gauche (WAAPI). */
.toast-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;
  background:currentColor;opacity:.3;transform-origin:left;}
.toast-x{border:none;background:none;font:inherit;font-size:20px;line-height:1;cursor:pointer;
  color:inherit;opacity:.55;padding:0 2px;}
.toast-x:hover{opacity:1;}
@media print{.toast-zone{display:none;}}

/* Cadre d'avertissements d'import (groupé, condensé, fermable) */
.avert-box{position:relative;background:var(--danger-fond);border:1px solid var(--danger-bord);color:var(--danger-texte);
  border-radius:8px;padding:9px 34px 9px 14px;margin-bottom:14px;font-size:13px;}
.avert-list{margin:.25em 0 0;padding-left:1.1em;line-height:1.3;}
.avert-list li{margin:0;}
.avert-close{position:absolute;top:5px;right:7px;background:none;border:none;color:var(--danger-texte);
  font-size:18px;line-height:1;cursor:pointer;padding:1px 6px;border-radius:6px;}
.avert-close:hover{background:var(--danger-bord);}

/* Pastilles de liens dans le tableau des élèves */
.lien-tag{display:inline-block;font-size:12px;padding:1px 8px;border-radius:10px;
  margin:1px 2px 1px 0;white-space:nowrap;}
.lien-regrouper{background:var(--ok-fond);color:var(--ok-texte);}
.lien-separer{background:var(--danger-fond);color:var(--danger-texte);}

/* listes / progressions — cartes CARRÉES en grille (décision Boris 2026-07-17 :
   plus de barres pleine largeur). Les actions de la page vivent ici, dans le
   contenu, et non dans la bande du titre. */
.prog-actions{display:flex;justify-content:flex-start;gap:8px;margin-bottom:16px;}
/* ── Carte de SÉLECTION — UN seul style pour toute liste d'objets qu'on ouvre
   (progressions, classes, et ce qui viendra). Décision Boris 2026-08-01 :
   « mets-les dans le même style […] enregistre le style à un endroit approprié ».
   Forme CARRÉE · icône et titre sur la MÊME ligne · survol net (bordure accent +
   fond teinté + ombre), le survol qui avait été mis au point sur les classes.
   ⚠ Nouvel objet à choisir → réutiliser ces classes, ne pas en écrire d'autres.
   Le gabarit HTML vit dans `_carte_selection.html` : une seule structure. */
.sel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,215px));gap:14px;}
/* Variante plus petite (progressions) : une progression s'ouvre depuis une liste
   qu'on parcourt, pas qu'on contemple — elle n'a pas besoin d'autant de place. */
.sel-grid-petite{grid-template-columns:repeat(auto-fill,minmax(160px,190px));}
/* Variante RECTANGULAIRE (décision Boris 2026-08-01, répartitions) : quand la
   carte doit montrer une information qu'on ne peut pas cacher derrière un
   crayon — ici la date de suppression auto (RGPD), « visible car importante ».
   Le carré la couperait ; le rectangle lui donne sa ligne. Même carte, même
   survol, même lien étiré : seules la largeur et la hauteur changent. */
.sel-grid-rect{grid-template-columns:repeat(auto-fill,minmax(250px,320px));}
.sel-grid-rect .sel-carte{aspect-ratio:auto;min-height:118px;}
/* La ligne d'échéance se colle en bas et s'autorise à passer à la ligne : une
   date ne doit jamais finir en « … ». */
.sel-carte-echeance{margin-top:auto;padding-top:8px;font-size:12px;color:var(--muted);
  white-space:normal;line-height:1.35;}
.sel-carte-echeance strong{color:var(--ink);}
.sel-carte{position:relative;aspect-ratio:1;display:flex;flex-direction:column;gap:3px;
  background:var(--card);border:1px solid var(--line-doux);border-radius:10px;padding:12px 14px;
  overflow:hidden;transition:border-color .12s,box-shadow .12s,background .12s;}
.sel-carte:hover{border-color:var(--accent);background:var(--fond-doux);
  box-shadow:0 4px 14px color-mix(in srgb, var(--nuit) 13%, transparent);}
/* `align-items:flex-start` : un titre sur deux lignes ne doit pas décentrer
   l'icône — elle reste calée en haut, comme une puce. */
.sel-carte-tete{display:flex;align-items:flex-start;gap:9px;min-width:0;margin-bottom:3px;}
.sel-carte-ico{flex:0 0 30px;height:30px;border-radius:8px;background:var(--accent);color:var(--blanc);
  display:flex;align-items:center;justify-content:center;}
/* Lien ÉTIRÉ : le ::after couvre la carte entière, qui devient donc cliquable
   sans imbriquer d'éléments interactifs (le crayon repasse au-dessus par
   z-index). `position:relative` sur .sel-carte est ce qui borne le ::after. */
.sel-carte-lien{text-decoration:none;color:inherit;min-width:0;}
.sel-carte-lien::after{content:"";position:absolute;inset:0;z-index:0;}
/* La carte est CARRÉE : ce qui dépasse est coupé, donc rien ne doit dépasser.
   Titre borné à 2 lignes, informations secondaires à une seule — un nom long
   (« Sciences et technologie — 6e ») ne doit pas pousser le reste hors du cadre. */
.sel-carte-titre{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;font-weight:600;color:var(--ink);font-size:14.5px;line-height:1.25;}
.sel-carte-sub,.sel-carte-meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  color:var(--muted);}
.sel-carte-sub{font-size:12.5px;}
.sel-carte-meta{font-size:12px;opacity:.85;}
/* Un badge éventuel se colle en bas : il ne dispute pas sa place au texte. */
.sel-carte .badge-v2{margin-top:auto;align-self:flex-start;}
/* Théorique / avancement (ADR-0013 n° 5-8) : le rôle se lit sur la carte ; la
   théorique non encore copiée porte « Commencer l'année ». Le bouton passe
   par-dessus le lien étiré de la carte (même règle que le crayon). */
/* Mes progressions : une COLONNE par niveau (6e, 5e… DP), côte à côte, cartes
   compactes empilées — la page tient sur un écran (Boris, 03/10/2026). */
.prog-groupes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;align-items:start;}
.prog-groupe{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--muted);}
.prog-pile{display:flex;flex-direction:column;gap:8px;}
/* Étages (03/10/2026) : Collège, High School en colonnes ; le reste en liste. */
.prog-etage{margin:0 0 18px;}
.prog-etage-titre{margin:0 0 10px;padding-bottom:4px;font-size:17px;font-weight:700;color:var(--ink);border-bottom:1px solid var(--line);}
.prog-reste{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 16px;align-items:start;}
.prog-pile .sel-carte,.prog-reste .sel-carte{aspect-ratio:auto;padding:9px 11px;gap:2px;}
.prog-pile .sel-carte-tete,.prog-reste .sel-carte-tete{margin-bottom:1px;align-items:center;}
.prog-pile .sel-carte-ico,.prog-reste .sel-carte-ico{flex-basis:26px;height:26px;}
.prog-pile .sel-carte-titre,.prog-reste .sel-carte-titre{-webkit-line-clamp:2;}
.prog-pile .sel-carte-role,.prog-reste .sel-carte-role{margin-top:4px;}
.sel-carte-role{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:auto;}
.sel-carte-role form{position:relative;z-index:1;margin:0;}
.role-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;
  font-weight:600;color:var(--muted);background:var(--fond-gris);border:1px solid var(--line-fort);}
.bandeau-lecture{padding:8px 14px;margin-bottom:10px;border-radius:8px;font-size:13px;
  color:var(--ink);background:var(--fond-gris);border:1px solid var(--line-fort);}
/* Le crayon reste discret : il n'entre en couleur qu'au survol de SA carte.
   `position:relative` + z-index : il doit rester cliquable PAR-DESSUS le lien
   étiré, sinon ouvrir la modale ouvrirait la progression. */
.sel-carte-edit{margin-left:auto;position:relative;z-index:1;border:none;background:none;
  color:var(--muted);cursor:pointer;padding:4px;border-radius:6px;line-height:0;
  opacity:0;transition:opacity .12s;}
.sel-carte:hover .sel-carte-edit,.sel-carte-edit:focus-visible{opacity:1;}
.sel-carte-edit:hover{background:var(--fond-gris);color:var(--ink);}

/* Icône de matière (décision Boris 2026-07-17) : dans la modale d'édition, JUSTE
   une icône — une ligne, pas un menu nommé qui mange la hauteur. Le clic ouvre la
   banque dans une modale par-dessus (#dlg-icone, mutualisée pour la page). */
/* `display:flex` explicite : .form-row est un bloc (le libellé y passe à la
   ligne). Ici on veut le libellé À CÔTÉ de la pastille — une ligne de gagnée. */
.ico-champ{display:flex;align-items:center;gap:10px;}
.ico-champ-lab{font-size:12px;color:var(--muted);}
.ico-pastille{width:38px;height:38px;flex:none;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--accent);
  cursor:pointer;line-height:0;padding:0;}
.ico-pastille:hover{border-color:var(--accent);background:var(--fond-doux);}
.ico-grille{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:4px;}
.ico-grille li{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;
  cursor:pointer;font-size:13px;color:var(--ink);}
.ico-grille li:hover{background:var(--fond-doux);}
.ico-grille li[aria-selected="true"]{background:var(--accent);color:var(--blanc);}
.ico-grille li:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
/* Cascade de taxonomie : le résumé nomme le référentiel résolu (socle de la
   suggestion automatique) et reste discret tant que rien n'est déterminé. */
.taxo-resume{margin:6px 0 0;font-size:12px;color:var(--muted);min-height:1em;}
/* Dans l'assistant (corps scrollable de TAILLE FIXE), le résumé est un STATUT
   (aria-live) : il doit rester lisible même quand la cascade déborde. Un nom de
   référentiel long le fait passer sur deux lignes (« IB Théorie de la
   connaissance (first assessment 2022) ») et la 2e ligne tombait sous le
   scrollport → on lisait « — 44 » sans « items ». Collé au bas du scrollport
   plutôt que défilant hors de vue. Bordure + fond opaque : quand le contenu
   passe dessous, ça se lit comme une BARRE DE STATUT ancrée, pas comme un
   chevauchement accidentel. */
.asst-corps .taxo-resume{position:sticky;bottom:0;background:var(--card);
  margin:6px -22px 0;padding:8px 22px 12px;border-top:1px solid var(--line);}
/* Tant que rien n'est déterminé, le résumé est VIDE : pas de barre flottante
   sans contenu (la place reste réservée par min-height, le menu ne saute pas). */
.asst-corps .taxo-resume:empty{border-top:none;padding-top:0;}
/* Drapeau du curriculum : à CÔTÉ du menu (un <option> ne peut pas porter de SVG).
   Largeur réservée même quand il est vide (« Autre ») → le menu ne saute pas. */
.taxo-dom{display:flex;align-items:center;gap:8px;}
.taxo-dom select{flex:1;min-width:0;}
/* Niveau · Matière · Filière sur une ligne ; la filière est ÉTROITE (« SL »,
   « HL » — décision Boris 2026-07-17 : elle ne mérite pas la même largeur). */
.taxo-ligne{display:flex;gap:12px;flex-wrap:wrap;}
.taxo-ligne .form-row{min-width:130px;}
.taxo-fil{flex:0 0 104px!important;min-width:0!important;}
/* Validation (au clic, cf. UX G6) : cadre rouge + message rouge sous le pied. */
/* Écran 2 de l'assistant : Icône + Nom sur une ligne. `flex-start` aligne les
   labels (deux .form-row identiques) ; la pastille prend la hauteur d'un input
   (41px = 21 de texte + 18 de padding + 2 de bordure) → bas alignés aussi. */
.asst-ligne-ico{display:flex;align-items:flex-start;gap:10px;}
.ico-pastille-champ{width:41px;height:41px;}
.champ-erreur{border-color:var(--danger)!important;}
.champ-erreur:focus{outline-color:var(--danger);}
.asst-erreur{margin:12px 0 0;font-size:13px;color:var(--danger);}
/* Assistant : TAILLE FIXE (décision Boris 2026-07-18) — mêmes dimensions d'un
   écran à l'autre, le corps défile. Le dialog est une colonne flex : tête et pied
   figés, corps extensible et scrollable. */
/* `dialog.asst-dlg` : bat la max-width:420 de .tl-dialog (spécificité). */
dialog.asst-dlg{width:540px;max-width:94vw;height:600px;max-height:88vh;padding:0;}
.asst-dlg > form{display:flex;flex-direction:column;height:100%;}
.asst-tete{display:flex;align-items:center;gap:12px;padding:20px 22px 12px;flex:none;}
.asst-corps{flex:1;min-height:0;overflow:auto;padding:0 22px;}
.asst-dlg .asst-erreur{flex:none;padding:0 22px;}
.asst-dlg .dlg-pied{flex:none;padding:12px 22px 18px;}
/* Barre de progression segmentée (à droite du titre) : un petit trait par étape. */
.asst-barre{margin-left:auto;display:flex;gap:5px;}
.asst-barre i{width:34px;height:4px;border-radius:2px;background:var(--line);transition:background .2s ease;}
.asst-barre i.plein{background:var(--accent);}
/* Boutons flèches (précédent / suivant) — carrés à icône. */
.asst-fleche{padding:6px 10px;line-height:0;}
/* Écran 3 : import de calendrier, en tête de l'éditeur. */
.asst-cal-import{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.asst-cal-resume{font-size:12.5px;}
/* Écran 4 : éditeur de calendrier. Compact, lignes serrées. */
.asst-cal-vert{margin:0 0 10px;padding:7px 10px;border-radius:8px;background:var(--ok-fond);
  color:var(--ok-texte);font-size:13px;}
.cal-annee{margin-bottom:6px;}
.cal-annee + .cal-annee{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}
.cal-annee-titre{font-weight:600;color:var(--ink);margin-bottom:6px;}
.cal-sstitre{font-size:12px;color:var(--muted);margin:10px 0 4px;text-transform:uppercase;letter-spacing:.03em;}
.cal-champ{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted);}
.cal-ligne{display:flex;gap:8px;align-items:flex-end;margin-bottom:4px;flex-wrap:wrap;}
.cal-ligne .cal-champ{flex:1;min-width:70px;}
/* Périodes / vacances : une ligne compacte, pas d'enroulement. */
.cal-per,.cal-vac{flex-wrap:nowrap;align-items:center;}
.cal-per input,.cal-vac input{width:100%;}
.cal-per input[type=text]:first-child{flex:0 0 52px;}
.cal-per input[type=text]:nth-child(2){flex:1;min-width:0;}
.cal-per input[type=date],.cal-vac input[type=date]{flex:0 0 132px;}
.cal-vac input[type=text]{flex:1;min-width:0;}
.cal-per .btn,.cal-vac .btn{flex:none;padding:6px 9px;}
.cal-an2{display:flex;gap:8px;align-items:flex-start;font-size:13px;margin-top:10px;cursor:pointer;}
.taxo-drapeau{width:22px;flex:none;display:flex;align-items:center;justify-content:center;
  color:var(--muted);line-height:0;}
.ico-drapeau{border-radius:2px;display:block;}
/* Cascade en CARTES de l'assistant (écran 1) : chaque étape se révèle et propose
   une grille de cartes ; la sélection est en accent (comme la banque d'icônes).
   Le curriculum tient sur une ligne (3 cartes) ; les matières nombreuses (IB DP)
   enroulent et défilent dans le corps du dialog. */
.tc-etape{margin-bottom:14px;}
.tc-titre{margin:0 0 6px;font-size:12px;color:var(--muted);text-transform:uppercase;
  letter-spacing:.03em;}
.tc-manque .tc-titre{color:var(--danger);}
.tc-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;}
.tc-carte{display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 12px;
  border:1px solid var(--line);border-radius:9px;background:var(--card,var(--card));color:var(--ink);
  cursor:pointer;text-align:center;font-size:13.5px;line-height:1.25;
  transition:border-color .12s,background .12s,color .12s;}
.tc-carte:hover{border-color:var(--accent);background:var(--fond-doux);}
.tc-carte.est-choisi{border-color:var(--accent);background:var(--accent);color:var(--blanc);}
.tc-carte:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.tc-drapeau{flex:none;width:22px;line-height:0;display:flex;}
.tc-lbl{min-width:0;}
.tc-autre .tc-lbl{color:var(--muted);font-style:italic;}
.tc-autre.est-choisi .tc-lbl{color:var(--blanc);}
/* Pied des modales : Supprimer à gauche, Annuler/Enregistrer à droite. Remonté
   ici depuis le <style> d'apercu.html (N°133) : deux pages s'en servent
   désormais, et la présentation des modales doit être la même partout. */
.dlg-pied{display:flex;align-items:center;gap:8px;margin-top:16px;}
.dlg-pied-droite{margin-left:auto;display:flex;gap:8px;}
/* Échéance de conservation (RGPD, tranche 7) : texte + petit menu de réglage. */
.echeance{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:5px;}
.echeance-txt{font-size:12.5px;color:var(--muted);}
.echeance-form{display:inline;margin:0;}
.echeance-form select{font-size:12px;padding:2px 6px;border:1px solid var(--line);border-radius:6px;
  color:var(--muted);background:var(--card);cursor:pointer;}
.tag{display:inline-block;background:var(--violet-fond);color:var(--violet);border-radius:6px;padding:2px 8px;font-size:12px;}
.empty{text-align:center;color:var(--muted);padding:40px;}

/* ---------- Auth (pages centrées) ---------- */
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;}
.auth-card{background:var(--card);border-radius:14px;box-shadow:0 6px 24px var(--ombre-2);padding:28px;width:100%;max-width:380px;}
.auth-logo{width:44px;height:44px;border-radius:10px;background:var(--accent);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;margin:0 auto 8px;}
.auth-tagline{text-align:center;color:var(--muted);font-size:13px;font-weight:600;margin:0 0 16px;}
.auth-title{text-align:center;margin:0 0 18px;font-size:19px;color:var(--ink);}
.auth-card .btn{width:100%;justify-content:center;margin-top:14px;}
.auth-links{text-align:center;margin-top:16px;font-size:13px;}
.auth-links a{color:var(--accent);text-decoration:none;}

/* ---------- Grille calendrier / timeline (lecture seule en 5c) ---------- */
.cal-scroll{overflow-x:auto;}
.bande{display:flex;align-items:stretch;margin-bottom:10px;}
.bande-titre{flex:0 0 24px;background:var(--tete);color:var(--nuit);font-weight:700;font-size:12px;
  display:flex;align-items:center;justify-content:center;writing-mode:vertical-lr;text-orientation:upright;
  letter-spacing:3px;border-radius:5px 0 0 5px;}
.cal-grid .grid{position:relative;}
.cal-grid .hrow{display:flex;}
.cal-grid .hcell{flex:0 0 auto;border-right:1px solid var(--grid-line);text-align:center;overflow:hidden;white-space:nowrap;}
.cal-grid .months .hcell{font-size:9px;color:var(--nuit);background:var(--fond-gris);font-weight:600;padding:1px 0;
  /* Séparateur de mois : une barre légèrement plus FONCÉE que le fond — le filet
     blanc se confondait avec la page (retour Boris, N°178). */
  border-right:2px solid var(--accent-bord);}
.cal-grid .weeks .hcell{font-size:9px;color:var(--ink-2);padding:1px 0;}
.cal-grid .weeks .hcell.A{background:var(--weekA);}
.cal-grid .weeks .hcell.B{background:var(--weekB);}
.cal-grid .days .hcell{font-size:8px;color:var(--ink-2);padding:0;border-bottom:1px solid var(--grid-line);}
/* Bloc d'en-tête (mois/semaines/jours/numéros) — repère des barres de vacances
   (N°157) : `.breaks` s'y cale, donc les barres s'arrêtent au bas de la ligne
   des numéros de jours au lieu de barrer les pistes. */
.cal-grid .entetes{position:relative;}
.cal-grid .breaks{position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;}
.cal-grid .break{position:absolute;top:0;bottom:0;width:6px;background:var(--vac);opacity:.85;border-radius:1px;pointer-events:auto;cursor:help;}

/* ---------- Fil d'Ariane + onglets de progression ---------- */
/* Le bloc de titre de la bande : le CHEMIN au-dessus, le NOM DE LA PAGE en
   dessous. Les deux viennent de la même variable `fil` (base.html) — d'où
   l'impossibilité d'avoir l'un sans l'autre. */
.titre-page{display:flex;flex-direction:column;gap:1px;min-width:0;}
.fil{font-size:11px;color:var(--bandeau-muted);}
.fil ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.fil li{display:flex;align-items:center;gap:6px;}
.fil li + li::before{content:'›';opacity:.6;}
.fil a{color:var(--bandeau-txt);text-decoration:none;font-weight:600;}
.fil a:hover{text-decoration:underline;}
.fil [aria-current]{color:var(--bandeau-txt);}

.tabs{display:flex;gap:4px;padding:0 24px;background:var(--bandeau);border-bottom:1px solid var(--ombre-2);}
.tabs a{padding:5px 16px;text-decoration:none;color:var(--bandeau-muted);font-weight:600;font-size:14px;
  border-bottom:3px solid transparent;margin-bottom:-1px;}
.tabs a:hover{color:var(--blanc);}
.tabs a.active{color:var(--blanc);border-bottom-color:var(--blanc);}
.tabs a.soon{opacity:.6;}
/* Bandeau « calendrier par défaut » sous les onglets (N°141) : ambre discret,
   même registre que les indicateurs doux du projet. */
.tabs-avis{padding:6px 24px;background:var(--alerte-fond);border-bottom:1px solid var(--alerte-bord);
  color:var(--alerte-texte);font-size:13px;}
.tabs-avis a{color:var(--alerte-texte);font-weight:600;}
/* N°358 : « … n'a pas de cours » + « Régler » — la même bande d'avis, son bouton à la suite du texte. */
.regler-cours .btn{margin-left:8px;vertical-align:middle;color:var(--blanc);}
.sem-contenu .regler-cours{margin:0 0 8px;border:1px solid var(--alerte-bord);border-radius:8px;}
/* sélecteur d'année (horizon 2 ans) : segment aligné à droite, sur la ligne des onglets */
.year-switch{margin-left:auto;align-self:center;display:inline-flex;border:1px solid var(--sur-sombre-3);border-radius:8px;overflow:hidden;}
.year-switch a{padding:4px 12px;font-size:13px;font-weight:600;color:var(--bandeau-muted);text-decoration:none;border-bottom:none;margin-bottom:0;}
.year-switch a.on{background:var(--card);color:var(--bandeau);}
.year-switch a:not(.on):hover{background:var(--sur-sombre-2);color:var(--blanc);}
/* Variante dans la toolbar (fond clair, N°103) : segmented control poussé à droite. */
.tl-toolbar .year-switch{margin-left:auto;border-color:var(--line);}
.tl-toolbar .year-switch a{color:var(--muted);padding:5px 12px;}
.tl-toolbar .year-switch a.on{background:var(--bandeau);color:var(--blanc);}
.tl-toolbar .year-switch a:not(.on):hover{background:var(--bg);color:var(--ink);}
.tabs a .pill{font-size:10px;background:var(--fond-gris);color:var(--discret);border-radius:8px;padding:1px 6px;margin-left:6px;}

/* ligne des numéros de jour dans la grille */
.cal-grid .jours .hcell{font-size:8px;color:var(--ink-2);padding:0 0 1px;}

/* ---------- 6b–6e : éditeur de timeline (pistes + blocs) ---------- */
.cal-grid .pistes{position:relative;}
.cal-grid .piste{position:relative;height:38px;
  background-image:repeating-linear-gradient(to right,transparent 0,transparent calc(var(--col-w) - 1px),var(--grid-line) calc(var(--col-w) - 1px),var(--grid-line) var(--col-w));}
.cal-grid .piste + .piste{border-top:1px dashed var(--grid-line);}
.cal-grid .bloc{position:absolute;top:4px;height:30px;border-radius:4px;color:var(--blanc);padding:2px 4px;
  font-size:11px;overflow:hidden;cursor:grab;touch-action:none;border:2px solid transparent;
  box-shadow:0 1px 2px var(--ombre-2);user-select:none;}
.cal-grid .bloc .nom{font-weight:600;white-space:nowrap;line-height:14px;}
.cal-grid .bloc .meta{font-size:9px;opacity:.92;white-space:nowrap;line-height:12px;}
.cal-grid .bloc.mini{padding:2px 1px;text-align:center;}
.cal-grid .bloc.mini .nom{font-size:9px;line-height:12px;}
.cal-grid .bloc.mini .meta{font-size:8px;line-height:10px;}
/* Sélection : le trait vit dans un élément À CÔTÉ du bloc (`.bloc-cadre`, posé
   dans la couche des pistes), et non en `outline` sur le bloc — le `clip-path`
   en dents de scie d'un segment coupé rognait le contour, si bien qu'un bloc
   découpé par des vacances ou une fin de trimestre n'en montrait aucun (N°182).
   Le cadre enjambe le trou des vacances ; le bloc, lui, ne garde que son rang. */
.cal-grid .bloc.sel{z-index:5;}
.cal-grid .bloc-cadre{position:absolute;pointer-events:none;z-index:6;
  border:2px solid var(--ink);border-radius:6px;}
.cal-grid .bloc-cadre.frere{border-style:dashed;}
/* conflit : liseré blanc + anneau rouge débordant (visible sur toute couleur, même empilé) */
.cal-grid .bloc.conflit{border-color:var(--blanc);box-shadow:0 0 0 2px var(--danger),0 1px 3px var(--ombre-3);}
.cal-grid .bloc.deborde{border-color:var(--signal);
  background-image:repeating-linear-gradient(45deg,var(--sur-sombre-2) 0 5px,transparent 5px 10px);}
.cal-grid .bloc.verrou{cursor:default;}
/* ---------- Pistes sémantiques v2 (ADR-0005) : Unit / Topic / Note ----------
   Hauteurs par piste : Unit (p1) et Note (p3) = bandeaux FINS (1 ligne de
   texte) ; Topic (p2) garde la hauteur historique (nom + heures). La couleur
   des blocs Unit/Note vient d'ICI (pas du type : hors piste Topic le type
   n'est pas fonctionnel). */
/* Séances à leur place (étape 2, 04/10/2026) : sous chaque bloc de la piste principale,
   une case par séance — son n° dans sa séquence, à sa date. La piste grandit d'autant. */
.cal-grid .piste.piste-p2{height:54px;}
.cal-grid .seance-case{position:absolute;top:37px;height:14px;box-sizing:border-box;
  border:1.5px solid var(--muted);border-radius:3px;background:var(--card);color:var(--nuit);
  font-size:9px;font-weight:600;line-height:11px;text-align:center;overflow:hidden;
  cursor:pointer;z-index:2;user-select:none;}
.cal-grid .seance-case:hover{background:var(--accent-pale);}
.cal-grid .seance-case.sel{background:var(--accent);border-color:var(--accent) !important;color:var(--blanc);}
.cal-grid .seance-case[draggable="true"]{cursor:grab;}
/* Séance verrouillée (règle 9) : hachurée, ne se glisse pas. */
.cal-grid .seance-case.verrou{background:repeating-linear-gradient(135deg,var(--card) 0 3px,var(--fond-gris) 3px 6px);cursor:pointer;}
.cal-grid .seance-case.verrou.sel{background:var(--accent);}
.cal-grid .piste.piste-p1,
.cal-grid .piste.piste-p3,
.cal-grid .piste.piste-annexe{height:22px;}
.cal-grid .piste-p1 .bloc,
.cal-grid .piste-p3 .bloc,
.cal-grid .piste-annexe .bloc{top:2px;height:17px;padding:1px 5px;}
/* Note du contenu (étape 4) : dessinée depuis le déroulé, liseré pointillé = on ne la déplace pas. */
.cal-grid .note-contenu{position:absolute;top:2px;height:17px;border-radius:4px;color:var(--blanc);font-size:10px;font-weight:700;
  line-height:17px;padding:0 1px;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:clip;cursor:pointer;z-index:2;
  outline:1.5px dashed var(--voile-clair);outline-offset:-3px;}
.cal-grid .bloc.bloc-unit{background:var(--fond-gris);border-left:4px solid var(--accent);
  color:var(--nuit);box-shadow:none;}
.cal-grid .bloc.bloc-unit .nom{font-size:10px;line-height:13px;letter-spacing:.02em;}
.cal-grid .bloc.bloc-unit .unit-h{font-weight:400;font-size:9px;opacity:.75;}
.cal-grid .bloc.bloc-note{background:var(--alerte-fond);border:1px dashed var(--alerte);
  color:var(--alerte-texte);box-shadow:none;}
.cal-grid .bloc.bloc-note .nom{font-size:10px;line-height:12px;font-weight:500;font-style:italic;}
/* Bloc ANNEXE (N°176) : même gabarit fin que la Note, mais il porte la COULEUR
   choisie par le prof (posée en style inline) et un émoji facultatif. Le nom
   reste droit — un « IE4 » ou un « DM3 » n'est pas un mémo. */
.cal-grid .bloc.bloc-annexe .nom{font-style:normal;font-weight:600;}
.cal-grid .bloc.bloc-annexe .bl-emoji{font-size:11px;line-height:12px;}
/* Conflit sur une Unit/Note : le `box-shadow:none` ci-dessus (même spécificité,
   plus bas dans la feuille) effaçait l'anneau rouge — deux Units superposées ne
   se voyaient pas. On le REPOSE ici, après, pour toutes les pistes. */
.cal-grid .bloc.bloc-unit.conflit,
.cal-grid .bloc.bloc-note.conflit{border-color:var(--danger);
  box-shadow:0 0 0 2px var(--danger),0 1px 3px var(--ombre-3);}
/* Transition v1→v2 : badge « Nouvelle version disponible » (liste) + bandeau
   de bascule (onglet Progression v1). */
.badge-v2{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:10px;
  font-size:11px;font-weight:600;color:var(--violet);background:color-mix(in srgb, var(--violet) 12%, transparent);
  border:1px solid color-mix(in srgb, var(--violet) 35%, transparent);vertical-align:2px;}
.bandeau-v2{display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  padding:10px 14px;margin-bottom:12px;border-radius:8px;
  background:color-mix(in srgb, var(--violet) 8%, transparent);border:1px solid color-mix(in srgb, var(--violet) 30%, transparent);}
.bandeau-v2 .txt{flex:1;min-width:220px;font-size:13px;color:var(--violet);}
/* v2 — séquence découpée sur plusieurs trimestres : coin « coupé » côté coupure
   (encoche en dents de scie) ; le segment « suite » reprend sans arrondi. */
.cal-grid .bloc.seg-coupe{border-top-right-radius:0;border-bottom-right-radius:0;
  clip-path:polygon(0 0,100% 0,calc(100% - 4px) 25%,100% 50%,calc(100% - 4px) 75%,100% 100%,0 100%);}
/* La reprise porte la MÊME dentelure, en OPPOSITION DE PHASE : la fin rentre à
   25 % et 75 %, la reprise rentre à 0 %, 50 % et 100 %. Les deux bords
   s'emboîtent donc du regard au lieu de se faire face (retour Boris) — le
   simple filet blanc pointillé d'avant ne disait pas « ça continue ». */
.cal-grid .bloc.seg-suite{border-top-left-radius:0;border-bottom-left-radius:0;
  clip-path:polygon(4px 0,100% 0,100% 100%,4px 100%,0 75%,4px 50%,0 25%);}
/* Segment du MILIEU (bloc à cheval sur trois bandes) : coupé des deux côtés —
   une seule des deux règles ci-dessus s'appliquerait sinon. */
.cal-grid .bloc.seg-coupe.seg-suite{
  clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 25%,100% 50%,calc(100% - 4px) 75%,
    100% 100%,4px 100%,0 75%,4px 50%,0 25%);}
.cal-grid .bloc .nom .suite{font-weight:400;opacity:.8;font-style:italic;}
.cal-grid .bloc .badge{position:absolute;top:0;font-size:10px;line-height:1;pointer-events:none;text-shadow:0 0 2px var(--ombre-3);}
.cal-grid .bloc .badge.lock{right:1px;}
.cal-grid .bloc .badge.deb{left:1px;}
/* repère « aujourd'hui » : trait vertical pleine hauteur + fanion en tête */
/* Centré sur le trait de la grille, qui occupe le DERNIER pixel de la colonne d'avant
   (Boris, 04/10) : la barre de 2 px recule de 1,5 px ; le fanion (10 px) est centré sur elle. */
.cal-grid .cal-today{position:absolute;top:0;bottom:0;width:0;border-left:2px solid var(--accent);margin-left:-1.5px;
  z-index:6;pointer-events:none;box-shadow:1px 0 0 var(--voile-clair),-1px 0 0 var(--voile-clair);}
.cal-grid .cal-today::before{content:"";position:absolute;top:0;left:-6px;
  border:5px solid transparent;border-top-color:var(--accent);border-bottom:0;}

/* barre d'outils + légende (hors cadre) : moitié moins d'espace sous les onglets */
.tl-bar{margin-top:-12px;}
body.detail-seances .tl-toolbar{display:none;}
.tl-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.tl-sep{width:1px;height:20px;background:var(--line);}
.tl-sel{font-weight:600;font-size:13px;margin-left:4px;}
.tl-save{margin-left:auto;font-size:12px;color:var(--muted);}
.tl-legend{display:flex;gap:12px;flex-wrap:wrap;align-items:center;font-size:12px;
  padding:8px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:10px;}
.tl-legend .chip{display:inline-flex;align-items:center;gap:5px;}
.tl-legend .swatch{width:11px;height:11px;border-radius:3px;display:inline-block;}
.tl-legend .cap{margin-left:auto;font-weight:600;}
.tl-legend .cap.over{color:var(--danger);}
.tl-tip{position:fixed;z-index:1000;background:var(--nuit);color:var(--blanc);font-size:11px;padding:4px 8px;
  border-radius:4px;pointer-events:none;box-shadow:0 2px 6px var(--ombre-3);display:none;
  /* N°92 : les bulles longues (guidance de sous-domaine) se replient au lieu de
     déborder de l'écran ; les courtes restent sur une ligne (largeur au contenu) */
  max-width:420px;white-space:normal;line-height:1.45;}

/* modale d'édition d'une séquence */
.tl-dialog{border:none;border-radius:12px;padding:20px;max-width:420px;width:92vw;color:var(--ink);
  box-shadow:0 12px 44px var(--ombre-3);}
.tl-dialog::backdrop{background:var(--voile);}
.tl-dialog h3{font-size:16px;color:var(--ink);}
.ef-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;}
.ef-grid label{margin-top:0;}
/* Toggle switch (interrupteur binaire à effet immédiat) — voir docs/conception-ui.md §1.
   Composant réutilisable : label FIXE + piste/pouce portant l'état ; input caché mais
   focusable (role="switch"). ON = piste verte, pouce à droite. */
.switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;
  user-select:none;}
.switch input{position:absolute;width:1px;height:1px;opacity:0;margin:0;}
.switch-track{position:relative;flex:0 0 auto;width:34px;height:18px;border-radius:9px;
  background:var(--line);transition:background .15s;}
.switch-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;
  background:var(--card);box-shadow:0 1px 2px var(--ombre-3);transition:transform .15s;}
.switch input:checked + .switch-track{background:var(--ok);}
.switch input:checked + .switch-track .switch-thumb{transform:translateX(16px);}
.switch input:focus-visible + .switch-track{outline:2px solid var(--accent);outline-offset:2px;}
.switch-label{color:var(--muted);}
.switch input:checked ~ .switch-label{color:var(--ink);}
/* Lien discret « + Donner un autre nom » (révèle le champ Nom masqué par un
   « porte sur ») : pas un bouton plein, un lien aligné à gauche. */
.ef-nom-perso{background:none;border:none;padding:2px 0;margin:-2px 0 0;
  color:var(--muted);font-size:12px;cursor:pointer;text-align:left;width:max-content;}
.ef-nom-perso:hover{color:var(--accent);text-decoration:underline;}
/* Croix « × » trailing dans le champ Nom = retirer le nom (pattern removable field). */
.ef-nom-champ{position:relative;}
.ef-nom-champ input{padding-right:30px;}
.ef-nom-clear{position:absolute;right:6px;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:center;width:22px;height:22px;
  background:none;border:none;border-radius:50%;color:var(--muted);
  font-size:18px;line-height:1;cursor:pointer;}
.ef-nom-clear:hover{background:var(--bg);color:var(--danger,var(--danger-texte));}
/* ---------- Modale « Modifier le bloc » (N°102, v3 : label + toggle) ----------
   Type : largeur au contenu (plus en pleine largeur) ; le menu garde sa largeur.
   max-width:100% : un nom de type long (« Internal assessment: … ») borne le
   bouton à la modale et s'ellipse (.type-pick-nom) au lieu de la déborder. */
.ef-type{grid-column:1/-1;}
.ef-type .type-pick{display:inline-block;min-width:180px;max-width:100%;}
.type-pick-menu{min-width:240px;max-width:100%;}
/* Champ facultatif (Topic / Nom / Niveau) : en-tête = libellé (façon « Type ») +
   toggle. ON révèle le contrôle ; OFF le retire (remplace l'ancienne croix). */
.ef-opt{position:relative;}
.ef-opt-head{display:flex;align-items:center;gap:10px;margin-bottom:5px;}
.ef-opt-lab{font-size:13px;color:var(--muted);}
/* Champ texte Nom/Niveau : largeur de la ligne Durée/Quota (max-width, pour ne pas
   être étiré par la règle globale input[type=text]{width:100%} — cf. N°86). */
.ef-opt-in{max-width:164px;}
/* Topic : encadré façon « Type » (réutilise .type-pick-btn) + menu maison. */
.ef-topic-ctrl{position:relative;}
.ef-topic-box{max-width:210px;}
.ef-topic-cur.ef-topic-vide{color:var(--muted);}
/* Thème manquant sur une Unit (obligatoire) : l'encadré se signale au clic sur
   « Enregistrer », le temps que l'œil y revienne. */
.ef-topic-box.ef-topic-manquant{border-color:var(--danger);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 18%, transparent);}
.ef-topic-err{margin:6px 0 0;font-size:12px;color:var(--danger);}
.topic-pick-menu{position:absolute;left:0;top:calc(100% + 4px);z-index:20;margin:0;padding:4px;
  list-style:none;min-width:280px;max-height:260px;overflow:auto;background:var(--card);
  border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px var(--ombre-2);}
.topic-pick-menu li[role=option]{display:flex;align-items:center;gap:10px;padding:7px 8px;
  border-radius:6px;cursor:pointer;}
.topic-pick-menu li[role=option]:hover{background:var(--bg);}
.topic-pick-nom{flex:1;min-width:0;}
.topic-pick-h{flex:none;color:var(--muted);font-size:12px;}
.topic-pick-grp{padding:8px 8px 3px;color:var(--muted);font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.03em;}
.topic-pick-grp:not(:first-child){border-top:1px solid var(--line);margin-top:4px;}
/* Deux étages (N°150) : étage 1 = des DOSSIERS (nom + compte + chevron),
   étage 2 = les options du dossier + une ligne de retour. */
.topic-pick-menu li.topic-pick-dossier{font-weight:600;}
.topic-pick-menu li.topic-pick-retour{display:flex;align-items:center;padding:7px 8px;
  color:var(--accent);font-weight:600;font-size:13px;cursor:pointer;border-radius:6px;}
.topic-pick-menu li.topic-pick-retour:hover{background:var(--bg);}
/* Menu qui bascule vers le haut quand l'espace manque sous l'encadré. */
.topic-pick-menu.vers-haut{top:auto;bottom:calc(100% + 4px);}
/* Durée / Quota accolés par un « / », encadrés rétrécis. Largeur par flex-basis
   (une règle globale input{width:100%} écraserait un width direct — cf. N°86). */
.ef-dq{display:flex;align-items:flex-end;gap:10px;}
.ef-dq-champ{flex:0 0 66px;}
/* Hauteur alignée sur l'encadré Type (padding vertical 8 px, comme .type-pick-btn). */
.ef-dq-champ input{width:100%;padding-top:8px;padding-bottom:8px;}
.ef-dq-slash{font-size:22px;color:var(--muted);line-height:1;padding-bottom:6px;}
/* Toggles de la modale : plus petits que le switch standard (scopé à l'en-tête). */
.ef-opt-head .switch-track{width:28px;height:16px;}
.ef-opt-head .switch-thumb{width:12px;height:12px;}
.ef-opt-head .switch input:checked + .switch-track .switch-thumb{transform:translateX(12px);}
/* Fenêtre resserrée : les champs sont compacts, pas besoin de 420 px. */
#edit-dialog{max-width:320px;}
/* Un menu déroulant ouvert doit pouvoir SORTIR de la modale (N°150) : le
   `overflow:auto` du <dialog> le coupait net, quel que soit le côté choisi.
   Rendu au scroll dès que le menu se referme (classe posée par le JS). */
#edit-dialog.menu-ouvert{overflow:visible;}
/* Infobulle LOCALE du Quota : vit DANS le dialog (top layer) → au-dessus de la
   modale, contrairement au tooltip global posé sur <body> (qui passe derrière). */
.ef-quota-w{position:relative;}
.ef-quota-tip{position:absolute;left:0;bottom:calc(100% + 6px);width:210px;max-width:70vw;
  background:var(--nuit);color:var(--blanc);font-size:12px;line-height:1.45;padding:7px 9px;border-radius:8px;
  opacity:0;pointer-events:none;transition:opacity .12s;z-index:5;}
.ef-quota-w:hover .ef-quota-tip,.ef-quota-w:focus-within .ef-quota-tip{opacity:1;}

/* ---------- Volet latéral partagé (drawer droite) ----------
   Coquille générique réutilisée par plusieurs pages (volet séquence/analyse de
   l'aperçu, « Ma bibliothèque » de l'onglet Programme). Les contenus propres à
   chaque volet restent dans leur page. Ouverture par glissement : fermé =
   translateX(102%) + visibility hidden (retardée le temps de la transition) ;
   .ouvert = en place. L'overlay fond en opacité. */
.volet-overlay{position:fixed;inset:0;background:var(--voile);z-index:40;
  opacity:0;visibility:hidden;transition:opacity .28s ease,visibility 0s linear .28s;}
.volet-overlay.ouvert{opacity:1;visibility:visible;transition:opacity .28s ease;}
.volet{position:fixed;top:0;right:0;height:100vh;width:min(480px,94vw);z-index:41;
  background:var(--card);box-shadow:-8px 0 32px var(--ombre-2);
  display:flex;flex-direction:column;
  transform:translateX(102%);visibility:hidden;
  transition:transform .28s ease,visibility 0s linear .28s;}
.volet.ouvert{transform:translateX(0);visibility:visible;transition:transform .28s ease;}
/* Tête aux couleurs de la bande supérieure du site (fil d'Ariane). */
.volet-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
  padding:16px 18px;background:var(--bandeau);}
.volet-titre{font-size:16px;font-weight:600;color:var(--bandeau-txt);}
.volet-tete .muted{color:var(--bandeau-muted);}
.volet-actions{display:flex;align-items:center;gap:10px;}
.volet-fermer{border:none;background:none;font-size:24px;line-height:1;color:var(--bandeau-muted);cursor:pointer;padding:0 4px;}
.volet-fermer:hover{color:var(--bandeau-txt);}
.volet-corps{flex:1;overflow-y:auto;padding:14px 18px;display:flex;flex-direction:column;gap:12px;}
.volet-vide{color:var(--muted);font-size:13px;text-align:center;padding:24px 0;}
/* « + » rond bleu : bouton d'ajout partagé (toolbar/volet de l'aperçu, ligne de
   filtre de l'onglet Programme). */
/* Bouton « + » d'ajout (bloc, séance, item) : EXACTEMENT la même boîte que les
   boutons-icônes voisins (.btn.btn-secondary.btn-sm.btn-ico) — on ne fait que le
   recolorer en accent pour qu'il reste l'action distincte. */
.btn-ajout{background:var(--accent);color:var(--blanc);border-color:var(--accent);}
.btn-ajout:hover{background:var(--accent-dark);border-color:var(--accent-dark);}
/* Bouton carré à icône (toolbar aperçu, import de la config…). */
.btn-ico{display:inline-flex;align-items:center;justify-content:center;padding:6px 8px;line-height:0;}
.btn-ico .ico{display:block;}

/* fiche-modale d'un élève (répartition) : réutilise .tl-dialog */
.fiche-dialog{max-width:860px;}
/* Corps de la fiche sur 3 colonnes (moins haute) ; Liens en pleine largeur dessous. */
.fiche-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:start;}
.fiche-cols .fiche-bloc{margin:0;}
.fiche-liens{grid-column:1 / -1;}
@media (max-width:640px){.fiche-cols{grid-template-columns:1fr;}}
.table-cliquable tbody tr{cursor:pointer;}
.table-cliquable tbody tr:hover td{background:var(--accent-pale);}
.fiche-bloc{margin:12px 0 0;border:1px solid var(--bord,var(--line-fort));border-radius:8px;padding:8px 12px;}
.fiche-bloc legend{font-size:.85em;color:var(--muted);padding:0 4px;}
.fiche-check{display:inline-flex;align-items:center;gap:5px;margin:2px 14px 2px 0;font-weight:400;}
.fiche-check input{width:auto;margin:0;}
.fiche-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;}
.liens-liste{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px;}
.liens-liste li{display:flex;align-items:center;gap:8px;font-size:13px;}
.lien-retirer{background:none;border:none;color:var(--danger);cursor:pointer;padding:2px;display:inline-flex;}
.lien-retirer:hover{color:var(--danger-texte);}
.lien-ajout{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.lien-ajout select{width:auto;}
.lien-recherche-wrap{position:relative;flex:1;min-width:170px;}
.lien-recherche-wrap input{width:100%;}
.suggestions{position:absolute;top:100%;left:0;right:0;z-index:10;background:var(--card);
  border:1px solid var(--line-fort);border-radius:8px;margin-top:2px;max-height:184px;overflow:auto;
  box-shadow:0 6px 18px var(--ombre-2);}
.suggestion{padding:6px 10px;cursor:pointer;font-size:13px;}
.suggestion:hover{background:var(--accent-pale);}

/* ---------- 5e : sidebar fixe, en-tête collant, grille config 2 colonnes ---------- */
.sidebar{position:sticky;top:0;height:100vh;align-self:flex-start;}
.stickytop{position:sticky;top:0;z-index:20;background:var(--bandeau);}
/* Cadres de config en 3 colonnes : Paramètres ÉTROIT (col 1) · Types (col 2) ·
   Périodes puis Vacances EMPILÉES (col 3, conteneur .cfg-col3). La colonne 3 coule
   indépendamment → Vacances reste collée sous Périodes, quelle que soit la hauteur
   du cadre Types. Enveloppe sur petit écran (flex-wrap). */
.cfg-grid{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;}
.cfg-grid>.card,.cfg-grid>.cfg-col3>.card{min-width:0;margin-bottom:0;}
.cfg-card-params{flex:0 0 180px;}
.cfg-card-types{flex:1 1 320px;}
.cfg-col3{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:16px;}
/* Sélecteur de couleur compact (config) — petit carré qui ne s'étire pas. */
.cfg-couleur{flex:none;}
/* Palette de couleurs (N°280, nuancier.js) : s'ouvre sous tout <input type="color">. */
.nuancier{position:fixed;z-index:1000;background:var(--card);border:1px solid var(--line);
  border-radius:8px;box-shadow:0 6px 20px var(--ombre-2);padding:8px;display:flex;
  flex-direction:column;gap:6px;}
.nu-rangee{display:flex;gap:4px;}
.nu-pastille{width:24px;height:24px;border-radius:5px;border:1px solid var(--ombre-2);
  padding:0;cursor:pointer;font-size:13px;font-weight:700;line-height:1;}
.nu-pastille:hover{transform:scale(1.12);}
.nu-pastille[aria-pressed="true"]{outline:2px solid var(--ink);outline-offset:1px;}
.nu-pastille:focus-visible,.nu-libre:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.nu-libre{display:flex;align-items:center;gap:6px;border:none;background:none;padding:3px 2px;
  font:inherit;font-size:12px;color:var(--ink);cursor:pointer;text-align:left;}
.nu-libre:hover{color:var(--accent);}
.nu-apercu{width:16px;height:16px;border-radius:4px;border:1px dashed var(--muted);flex:none;}
.nu-libre[aria-pressed="true"] .nu-apercu{border-style:solid;}
/* Ordre des cadres : Paramètres · Périodes+Vacances (col 3) · Types de bloc.
   (Types passé à DROITE — inversé avec les cadres Périodes/Vacances.) */
.cfg-card-params{order:0;}
.cfg-col3{order:1;}
.cfg-card-types{order:2;}
/* Tableau des types de bloc : colonnes alignées couleur · nom · N° · préfixe · 🗑. */
.cfg-tb-tete{font-size:10.5px;color:var(--muted);text-transform:uppercase;
  letter-spacing:.02em;margin-bottom:2px;}
/* Largeurs via flex-basis (pas width) : une règle globale `input[type=text]
   {width:100%}` est plus spécifique que `.cfg-tb-*` et gagnerait sur `width` —
   mais flex-basis prime sur width pour le dimensionnement d'un flex-item. */
.cfg-tb-couleur{flex:0 0 28px;text-align:center;}
.cfg-tb-num{flex:0 0 34px;text-align:center;}
.cfg-ta-frise{flex:0 0 84px;text-align:center;}
.cfg-tb-prefixe{flex:0 0 56px;text-align:center;min-width:0;}
.cfg-tb-quota{flex:0 0 48px;text-align:center;min-width:0;}
/* Enveloppe « Contenu » (N°126, maquette validée) : ligne d'enveloppe en tête
   (seule porteuse du quota global), membres en PAIRS indentés sous un filet. */
.cfg-env-ligne .cfg-env-nom{flex:1;min-width:0;font-weight:600;}
.cfg-env-groupe{margin-left:10px;border-left:2px solid var(--line);padding-left:10px;}
.cfg-env-detacher{flex:0 0 48px;}
/* Dépliage borné du Contenu : thèmes (résumé + Σ) → topics indentés. */
.cfg-theme summary{cursor:pointer;list-style:none;}
.cfg-theme summary::before{content:"▸";font-size:14px;color:var(--muted);margin-right:6px;}
.cfg-theme[open] summary::before{content:"▾";}
.cfg-theme summary:hover{color:var(--accent);}
.cfg-theme summary:hover::before{color:var(--accent);}
/* Rattacher un type perso au Contenu (N°126) : une icône discrète par ligne,
   symétrique du ✕ qui détache côté guide — pas de colonne ni de lien en plus. */
.cfg-tb-att{flex:0 0 24px;font-size:14px;line-height:1;}
.cfg-theme-total{font-size:12px;color:var(--muted);white-space:nowrap;}
.cfg-topic-sous{margin-left:18px;}
/* Association d'un type au programme expérimental du GUIDE (menu « Guide ») :
   un type associé tire sa cible du référentiel adopté → son quota manuel est
   masqué, remplacé par les heures officielles (lecture seule, grisées). */
.cfg-tb-guide{flex:0 0 130px;min-width:0;font-size:12px;}
.cfg-guide-h{flex:0 0 48px;text-align:center;color:var(--muted);font-size:12px;white-space:nowrap;}
/* Type « contenu » (séquence de cours) : Σ dérivée + chevron qui déplie les
   topics du guide et leurs quotas (colonne présente sur toutes les lignes du
   cadre guide pour garder l'alignement). */
.cfg-tb-chev{flex:0 0 22px;display:inline-flex;justify-content:center;align-items:center;}
/* Flèches agrandies (N°126, retour Boris : trop discrètes à 12/10 px). */
button.cfg-tb-chev{border:none;background:none;cursor:pointer;color:var(--muted);
  font-size:16px;padding:2px;border-radius:4px;}
button.cfg-tb-chev:hover{background:var(--fond-gris);color:var(--ink);}
.cfg-topics{margin:2px 0 10px;}
.cfg-topic-ligne{margin:2px 0 2px 36px;gap:8px;}
.cfg-topic-nom{flex:1;min-width:0;font-size:12.5px;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cfg-topic-ligne .cfg-tb-quota{height:26px;font-size:12px;}
.cfg-tb-suppr{flex:0 0 28px;display:inline-flex;justify-content:center;align-items:center;min-height:24px;}
.cfg-tb-check{margin:0;width:18px;height:18px;}
.cfg-tb-prefixe:disabled{background:var(--fond-gris);color:var(--discret);}
/* Barre du haut : import (icône) à gauche + statut d'auto-save. */
.cfg-topbar{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
/* Sous-menu à pastilles de la Configuration V2 (N°105) : années + Types de bloc,
   même esprit que le sous-menu du Programme. Import + statut poussés à droite. */
.cfg-subnav{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin:0 0 16px;}
.cfg-pills{display:flex;gap:8px;flex-wrap:wrap;}
.cfg-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border:1px solid var(--line);
  border-radius:8px;background:var(--card);text-decoration:none;color:var(--ink);font-size:13px;
  transition:border-color .12s,box-shadow .12s,background .12s;}
.cfg-pill .ico{width:15px;height:15px;}
.cfg-pill:hover{border-color:var(--accent);}
.cfg-pill.on{border-color:var(--accent);background:var(--accent-pale);color:var(--accent-dark);font-weight:600;
  box-shadow:inset 0 -3px 0 var(--accent);}
.cfg-subnav-actions{display:flex;align-items:center;gap:10px;}
/* Page ANNÉE (v2) : 3 cadres alignés, mais largeurs pondérées par le contenu —
   Paramètres n'a que des champs étroits (fixe, ne grandit pas) ; Vacances porte
   « nom + 2 dates + poubelle » → il prend le plus de place. */
.cfg-annee .cfg-card-params{flex:0 1 200px;}
.cfg-annee .cfg-card-periodes{flex:1.2 1 340px;}
.cfg-annee .cfg-card-vacances{flex:1.5 1 450px;}
/* Page TYPES DE BLOC (v2) : 2 cadres côte à côte (guide / personnalisés). */
.cfg-types>.card{flex:1 1 340px;}
/* Choix du programme (N°146) : rangée PLEINE LARGEUR sous les deux cadres de
   types — à 3 colonnes le cadre guide se serrait (noms tronqués). flex-basis,
   pas width (garde-fou : une règle globale plus spécifique gagnerait). */
.cfg-types>.cfg-card-choix{flex:1 1 100%;max-width:820px;order:3;}
.cfg-choix-ligne{gap:8px;align-items:center;}
.cfg-card-guide .cfg-guide-ligne{margin-bottom:8px;}
/* Même respiration dans le cadre « personnalisés » que dans le cadre guide. */
.cfg-types-bloc .cfg-tb-ligne{margin-bottom:8px;}
.cfg-guide-tete .cfg-guide-h{flex:0 0 60px;text-align:center;}
.cfg-card-guide .cfg-tb-quota{flex:0 0 60px;}
/* En-tête de carte : titre + « + » d'ajout à droite. */
.cfg-card-tete{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;}
.cfg-add-btn{width:24px;height:24px;flex:none;border:none;border-radius:6px;cursor:pointer;
  background:var(--accent);color:var(--blanc);font-size:16px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;padding:0;}
.cfg-add-btn:hover{background:var(--accent-dark);}
/* Ligne (période / vacances) : champs alignés sur UNE ligne (nowrap → la poubelle
   ne bascule jamais dessous ; le nom se comprime si la place manque). Les champs
   date natifs sont larges → on les borne pour laisser respirer le nom. */
.cfg-ligne{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;}
.cfg-ligne input[type=date]{width:130px;flex:none;}
/* Ligne d'ajout révélée par le « + » : légèrement mise en avant. */
.cfg-add-row{background:var(--fond-doux);border:1px solid var(--line);border-radius:8px;padding:8px;margin-top:8px;}

/* ---------- 6i : configuration compacte (gain de hauteur) ---------- */
.cfg-compact .card{padding:12px 14px;margin-bottom:12px;}
.cfg-compact .card h3{font-size:15px;margin-bottom:8px;}
.cfg-compact .card > p{font-size:12.5px;line-height:1.45;}
.cfg-compact label{margin:6px 0 3px;font-size:12px;}
.cfg-compact .checkbox{margin:8px 0;}
.cfg-compact input[type=text],.cfg-compact input[type=email],.cfg-compact input[type=password],
.cfg-compact input[type=number],.cfg-compact input[type=date],.cfg-compact select{padding:6px 9px;}
.cfg-compact input[type=color]{width:28px;height:26px;padding:1px;}
.cfg-compact .card form,.cfg-compact .card > div[style*="margin-bottom"]{margin-bottom:6px !important;}
/* cadre Paramètres : cellules empilées (1 colonne) → cadre étroit */
.cfg-cells{display:flex;flex-direction:column;gap:8px;align-items:stretch;}
.cfg-cells .cell{flex:none;}
.cfg-cells .cell input,.cfg-cells .cell select{width:100%;}
/* Suppression discrète (période / vacances / type) : icône poubelle, pas de gros
   bouton rouge — cohérent avec le reste du site. */
.cfg-suppr{display:inline-flex;align-items:center;justify-content:center;border:none;background:none;
  color:var(--muted);cursor:pointer;padding:4px;border-radius:6px;line-height:0;flex:none;
  min-width:24px;min-height:24px;}
.cfg-suppr:hover{background:var(--danger-fond);color:var(--danger);}
/* indicateur d'auto-sauvegarde */
.cfg-status{font-size:12px;font-weight:400;color:var(--ok);margin-left:6px;}

/* ---------- 6j : export / impression PDF ---------- */
.print-only{display:none;}
@media print {
  /* forcer l'impression des couleurs de fond (séquences, semaines A/B, vacances…) */
  *{-webkit-print-color-adjust:exact !important;print-color-adjust:exact !important;}
  .sidebar,.topbar,.tabs,.no-print{display:none !important;}
  .main,.content{display:block;}
  .content{padding:0 !important;}
  body{background:var(--card);}
  .print-only{display:block !important;}
  .cal-scroll{overflow:visible !important;}
  .cal-grid .bande{break-inside:avoid;}
  /* Marges L/R un peu plus larges : Chrome met la timeline à l'échelle pour REMPLIR la
     zone imprimable (contenu collé aux deux bords → dernière colonne au ras de la marge,
     « fin tronquée »). 18 mm L/R laissent une gouttière blanche visible après la grille. */
  @page{size:landscape;margin:12mm 18mm;}
}

/* ---------- Aplatissement PDF de l'export Planification (body.print-flat) ----------
   Chrome imprime la timeline via window.print() → Skia. Deux causes de PDF lourd
   et « flou puis net » dans Acrobat, propres à la timeline (l'export Répartition,
   tableau plat, n'a ni l'une ni l'autre) :
     1. police San Francisco *variable* → embarquée en Type 3 (un mini-programme par
        glyphe, lent). Correctif : forcer une police statique embarquable (Arial).
     2. transparence → soft masks raster recomposés à chaque zoom (ombres, clip-path
        en dents de scie, dégradés à alpha, opacité). Correctif : aplatir en opaque.
     3. TOUT dégradé CSS (même opaque) → Chrome l'émet en motif tiling + shading PDF
        que Acrobat ré-évalue à chaque zoom/défilement (« flou puis net »). Correctif :
        supprimer les dégradés à l'impression — ici les fines lignes de colonnes de la
        grille (l'en-tête mois/semaines garde l'échelle). Résultat : plus aucun
        Pattern/Shading → PDF = texte + rectangles pleins, parfaitement fluide.
   Scopé à body.print-flat (posé par les templates d'export progression) → n'affecte
   ni l'écran, ni l'export Répartition. Résultat : PDF quasi 100 % vectoriel + texte. */
@media print {
  /* 1. police embarquable → supprime les sous-polices Type 3 */
  body.print-flat, body.print-flat *{font-family:Arial,Helvetica,"Helvetica Neue",sans-serif !important;}
  /* 2. plus aucun soft mask : ombres, ombres de texte, découpe polygonale */
  body.print-flat .cal-grid .bloc,
  body.print-flat .cal-grid .bloc.conflit{box-shadow:none !important;}
  body.print-flat .cal-grid .bloc,
  body.print-flat .cal-grid .bloc .badge{text-shadow:none !important;}
  body.print-flat .cal-grid .bloc.seg-coupe,
  body.print-flat .cal-grid .bloc.seg-suite{clip-path:none !important;}
  /* 3. plus aucun motif/shading : on retire les dégradés (lignes de colonnes + rayures).
        Les lignes de colonnes sont portées par CHAQUE .piste (≈ 8 → 8 tiling patterns
        pleine page, masqués en luminosité → fige au zoom). C'est LE coupable principal. */
  body.print-flat .cal-grid .piste{background-image:none !important;}
  body.print-flat .cal-grid .bloc.deborde{background-image:none !important;}
  /* opacité < 1 = groupe de transparence → forcer opaque */
  body.print-flat .cal-grid .bloc .meta,
  body.print-flat .cal-grid .bloc .nom .suite{opacity:1 !important;}
}

/* ---------- Export PDF de la répartition (outil 2, tranche 6a) ----------
   Aperçu d'un document A4 portrait (synthèse + une fiche par classe), imprimé
   via window.print(). Les graphes d'équilibrage viendront enrichir la synthèse (6b). */
.export-barre{display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  justify-content:space-between;margin-bottom:18px;}
.export-doc{background:var(--card);color:var(--ink);max-width:780px;margin:0 auto;
  border:1px solid var(--line,var(--line));border-radius:10px;padding:26px 30px;
  box-shadow:0 1px 3px var(--ombre-1);}
.export-synthese{border-bottom:2px solid var(--ink);padding-bottom:14px;margin-bottom:18px;}
.export-synthese h2{margin:0 0 2px;font-size:22px;color:var(--ink);}
.export-soustitre{margin:0 0 10px;color:var(--muted);font-size:13px;}
.export-totaux{margin:0;font-size:15px;}
/* Graphes d'équilibrage (cartes sombres réutilisées du plateau) : 2×2 sous les totaux. */
.export-graphes{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px;}
.export-graphes:empty{display:none;}
.export-graphes .graphe-card{break-inside:avoid;}
.fiche-classe{margin:0 0 22px;break-inside:avoid;}
.fiche-classe-titre{display:flex;align-items:baseline;gap:10px;margin:0 0 8px;
  font-size:17px;color:var(--ink);border-bottom:1px solid var(--line-fort);padding-bottom:4px;}
.fiche-classe-eff{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap;}
.fiche-classe.non-affectes .fiche-classe-titre{color:var(--danger-texte);border-color:var(--danger-bord);}
.roster-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.roster-table th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);border-bottom:1.5px solid var(--ink);padding:3px 8px;}
.roster-table td{padding:3px 8px;border-bottom:1px solid var(--line);}
.roster-table tbody tr:nth-child(even){background:var(--fond-doux);}
.roster-table tr{break-inside:avoid;}
.r-num{width:2.4em;text-align:right;color:var(--discret);}
.r-sexe{width:3em;text-align:center;font-weight:700;color:var(--accent);}
.r-opts{color:var(--muted);}

@media print {
  /* Page nommée portrait posée à la RACINE (body) → tout le document, sans
     changement de type de page en cours de flux (sinon pages blanches en paysage,
     le type par défaut de l'outil 1). N'affecte pas l'export Planification. */
  @page rep{size:A4 portrait;margin:14mm;}
  body.print-portrait{page:rep;}
  .export-rep .export-doc{max-width:none;margin:0;border:none;border-radius:0;
    padding:0;box-shadow:none;}
  .export-rep .fiche-classe{break-before:page;}  /* une classe par page */
  .export-rep .export-synthese{break-after:avoid;}
}

/* ---------- Plateau de répartition (outil 2, tranche 5) ----------
   Format paysage, lisible en rétroprojection : bandeau (sélection · à placer ·
   actions) + une colonne par classe, défilement interne pour tenir l'écran. */
/* Bouton plein écran en bout de la barre d'onglets (projection). */
.tab-fs{margin-left:auto;background:none;border:none;color:var(--bandeau-muted);cursor:pointer;
  padding:6px 12px;display:inline-flex;align-items:center;}
.tab-fs:hover{color:var(--blanc);}

/* Plateau borné à la hauteur de l'écran : seules les colonnes de classes
   défilent en interne (la page ne défile pas). 75px ≈ bandeau collant. */
.content-plateau{padding:0;flex:none;min-height:0;height:calc(100vh - 62px);
  overflow:hidden;display:flex;flex-direction:column;}
.content-plateau .plateau{flex:1;min-height:0;}
.plateau{display:flex;flex-direction:column;gap:10px;padding:10px 20px 14px;}
.plateau .card{margin:0;}
.plateau-tete{display:grid;grid-template-columns:1.5fr 1.5fr 2fr;gap:12px;align-items:stretch;}
.plateau-tete h3{margin:0 0 .4em;font-size:14px;}
.plateau-tete .card{display:flex;flex-direction:column;padding:9px 14px;}
.aplacer-liste{display:flex;flex-wrap:wrap;gap:6px;overflow:auto;max-height:90px;
  align-content:flex-start;}
/* Actions : bouton carré « Répartition Auto » + 3 infos à sa droite. */
.plateau-tete .plateau-actions{flex-direction:row;align-items:center;gap:12px;}
#btn-lancer{flex:0 0 auto;min-width:96px;height:54px;justify-content:center;text-align:center;
  white-space:normal;line-height:1.2;font-weight:700;font-size:14px;padding:6px 12px;}
.plateau-actions .plateau-statut{flex:1;display:flex;flex-direction:column;gap:4px;}
.statut-ligne{font-weight:600;font-size:12.5px;border-radius:8px;padding:4px 10px;}
.statut-ligne.ok{background:var(--ok-fond);color:var(--ok-texte);}
.statut-ligne.ko{background:var(--danger-fond);color:var(--danger-texte);}
.statut-ligne.neutre{background:var(--alerte-fond);color:var(--alerte-texte);}

/* Graphiques de répartition (cartes sombres, lisibles en rétroprojection). */
.plateau-graphes{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:12px;}
.graphe-card{background:var(--nuit);border-radius:12px;padding:8px 10px 2px;min-width:0;}
.graphe-svg{width:100%;height:auto;display:block;}
.graphe-svg text{font-family:inherit;pointer-events:none;}  /* clic → la barre, pas le chiffre */
.graphe-svg rect{cursor:pointer;}
.g-classe{font-size:11px;text-anchor:middle;fill:var(--muted);}
.g-tot{font-size:11px;font-weight:700;text-anchor:middle;fill:var(--card);}
.g-seg{font-size:9.5px;font-weight:600;text-anchor:middle;fill:var(--card);}
.g-leg{font-size:11px;fill:var(--line-fort);}
.g-titre{font-size:13px;font-weight:700;text-anchor:middle;fill:var(--card);}

.plateau-classes{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;flex:1;min-height:0;}
.classe-col{display:flex;flex-direction:column;background:var(--card);
  border:1px solid var(--line);border-radius:12px;overflow:hidden;min-height:0;}
.classe-tete{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  padding:6px 10px;border-bottom:1px solid var(--line);}
.classe-nom{font-size:17px;font-weight:700;}
.classe-compte{font-size:13px;color:var(--muted);font-weight:600;flex:0 0 auto;}
.classe-compte.depasse{color:var(--danger);}
/* Options de la classe (abrégées 3 lettres) : entre le nom et l'effectif, sur une ligne. */
.classe-options{flex:1;min-width:0;font-size:11px;font-weight:600;letter-spacing:.03em;
  color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.classe-corps{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:max-content;
  gap:3px;padding:4px;overflow:auto;align-content:flex-start;flex:1;min-height:0;}

.eleve-chip{display:block;width:100%;text-align:center;background:var(--fond-doux);
  border:1px solid var(--line);border-radius:6px;padding:0 5px;line-height:1.25;font:inherit;
  font-size:12.5px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chip-cadenas{color:var(--alerte);margin-right:3px;}        /* élève contraint (1 classe possible) */
.chip-cadenas svg{vertical-align:-1px;}
.eleve-chip:hover{background:var(--accent-pale);border-color:var(--accent);}
.aplacer-liste .eleve-chip{width:auto;}
.eleve-chip{touch-action:none;}                 /* interact.js : drag fiable */
.eleve-chip.sel{border-color:var(--ink);box-shadow:0 0 0 2px var(--ombre-2);font-weight:600;}
.eleve-chip.incompatible{border-color:var(--danger);background:var(--danger-fond);color:var(--danger-texte);}
.eleve-chip.drag{opacity:.85;cursor:grabbing;}
.classe-corps.survol,.aplacer-liste.survol{outline:2px dashed var(--accent);outline-offset:-3px;border-radius:8px;}

/* Surbrillances croisées (5d) : clic élève → ses liens (vert = regrouper, rouge =
   séparer) ; clic barre/légende → élèves du paramètre. Les autres sont atténués
   (lecture immédiate en rétroprojection). */
.eleve-chip.dim{opacity:.26;}
/* Halo paramètre : couleur = celle de la barre/légende cliquée (variable --halo). */
.eleve-chip.chip-surligne{border-color:var(--halo,var(--alerte));box-shadow:0 0 0 2px var(--halo,var(--alerte));font-weight:600;}
.eleve-chip.chip-regrouper{border-color:var(--ok);box-shadow:0 0 0 2px color-mix(in srgb, var(--ok) 60%, transparent);font-weight:600;}
.eleve-chip.chip-separer{border-color:var(--danger);box-shadow:0 0 0 2px color-mix(in srgb, var(--danger) 60%, transparent);font-weight:600;}
/* Clic élève → halo des classes possibles (options ⊆ classe) ; autres grisées. */
.classe-col.classe-possible{border-color:var(--ok);box-shadow:inset 0 0 0 1px var(--ok);}
.classe-col.classe-impossible{opacity:.5;}

/* Carte « Élève sélectionné » : en-tête (nom · classe · badge F/G) + 2×2 compact */
.sel-tete{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;}
.sel-nom{font-weight:700;font-size:15px;}
.sel-classe{color:var(--muted);font-weight:600;font-size:13px;}
.sel-fg{margin-left:auto;font-weight:800;font-size:20px;line-height:1;}
/* Carte sélection : loupe de recherche + champ (état vide, détail, recherche). */
.sel-vide{display:flex;align-items:center;gap:8px;}
.loupe-btn{background:none;border:none;padding:3px;cursor:pointer;color:var(--muted);
  display:inline-flex;align-items:center;border-radius:6px;flex:0 0 auto;}
.loupe-btn:hover{color:var(--accent);background:var(--accent-pale);}
.loupe-deco{color:var(--muted);display:inline-flex;align-items:center;flex:0 0 auto;}
.sel-recherche{display:flex;align-items:center;gap:6px;}
.sel-recherche-wrap{position:relative;flex:1;min-width:0;}
.sel-recherche-wrap input{width:100%;}
.sel-opts{color:var(--muted);font-weight:600;font-size:11px;letter-spacing:.03em;}
/* Paramètres de l'élève en 4 pastilles sur une ligne (couleurs des graphes). */
.sel-pills{display:flex;gap:6px;flex-wrap:wrap;}
.sel-pill{font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;
  border:1px solid transparent;white-space:nowrap;line-height:1.35;}
.sel-pill.off{background:var(--fond-gris);color:var(--muted);border-color:var(--line);}

/* ============================================================================
   Accessibilité — passe UI/UX du 2026-07-10 (audit docs/ux/referentiel-ui-ux.md).
   ========================================================================== */

/* S3 — Focus clavier visible partout (WCAG 2.4.7). On utilise `outline`
   (non rognée par les parents `overflow:hidden`, contrairement à box-shadow).
   Les inputs gardent leur focus dédié (halo box-shadow, cf. `input:focus`). */
a:focus-visible, button:focus-visible, summary:focus-visible,
[role="tab"]:focus-visible, [role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible{
  outline:2px solid var(--accent); outline-offset:2px;
}
/* Contextes sombres (sidebar, onglets, bascule d'année) → outline claire pour
   rester visible sur le bandeau bleu marine. */
.sidebar a:focus-visible, .sb-action:focus-visible, .sb-toggle:focus-visible,
.tabs a:focus-visible, .year-switch a:focus-visible{ outline-color:var(--blanc); }

/* S4 — Respecter « prefers-reduced-motion » : neutraliser transitions et
   animations (volets qui glissent, spinner) pour les utilisateurs sensibles. */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}

/* --- Sélecteur de Topic en TROIS COLONNES (N°173) --------------------------
   Option A validée par Boris : les colonnes existent TOUJOURS (cadre de taille
   fixe), les vides portent une invite. La modale ne change donc jamais de
   taille en cours de sélection — et le menu, qui déborde déjà du dialog
   (.menu-ouvert, N°161), n'a pas à être replacé à chaque clic. */
.topic-cols{position:absolute;left:0;top:calc(100% + 4px);z-index:20;display:flex;
  background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;
  box-shadow:0 8px 24px var(--ombre-2);}
.topic-cols.vers-haut{top:auto;bottom:calc(100% + 4px);}
.topic-col{flex:0 0 260px;border-right:1px solid var(--line);display:flex;
  flex-direction:column;min-height:230px;max-height:300px;}
.topic-col:last-child{border-right:0;}
/* N°173 : plus d'en-tête de colonne (décision Boris 2026-07-23) — « GROUPE »
   puis une case grise vide n'apprenaient rien ; la ligne surlignée dans la
   colonne précédente dit déjà où l'on est. */
.topic-col ul{list-style:none;margin:0;padding:6px 4px;overflow:auto;flex:1;}
.topic-col-vide{padding:12px 10px;color:var(--muted);font-size:12px;font-style:italic;}
.topic-col li.col-lig{position:relative;display:flex;align-items:center;gap:8px;
  padding:7px 8px;border-radius:6px;cursor:pointer;font-size:13px;}
.topic-col li.col-lig:hover{background:var(--bg);}
.topic-col li.col-lig.sel{background:var(--accent-pale);font-weight:600;}
.topic-col li.col-lig .fl{flex:none;color:var(--muted);font-size:12px;margin-left:auto;}
/* Le cadre « à définir » vit DANS la ligne du choix, avec son crayon. */
.lig-choix{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;}
.lig-choix .k{font-size:11px;color:var(--muted);font-weight:600;}
.slot-chip{display:inline-flex;align-items:center;gap:5px;max-width:200px;
  border:1px dashed var(--alerte-bord);background:var(--alerte-fond);color:var(--alerte-texte);border-radius:6px;
  padding:2px 7px;font-size:12px;font-weight:600;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.slot-chip.defini{border-style:solid;border-color:var(--accent-bord);background:var(--fond-gris);color:var(--accent);}
.slot-chip .ic{opacity:.7;font-size:11px;}
/* Menu du guide pour un slot, ouvert par le crayon. */
.slot-menu{position:absolute;left:8px;top:calc(100% - 2px);z-index:30;min-width:250px;
  background:var(--card);border:1px solid var(--line);border-radius:8px;
  box-shadow:0 8px 24px var(--ombre-2);padding:4px 0;}
.slot-menu-tete{padding:6px 10px 5px;border-bottom:1px solid var(--line);
  color:var(--muted);font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;}
.slot-menu ul{list-style:none;margin:0;padding:4px;max-height:220px;overflow:auto;}
.slot-menu li{display:flex;justify-content:space-between;gap:8px;padding:7px 8px;
  border-radius:6px;cursor:pointer;font-size:13px;}
.slot-menu li:hover{background:var(--bg);}
/* Grisé = déjà pris par l'AUTRE choix : le guide veut deux thèmes distincts. */
.slot-menu li.off{color:var(--discret);cursor:not-allowed;}
.slot-menu li.off:hover{background:transparent;}
.slot-menu li.off .note{font-size:11px;}
.slot-menu li.slot-retirer{color:var(--danger);border-top:1px solid var(--line);
  margin-top:4px;padding-top:8px;border-radius:0;}
/* N°173 : le menu du guide d'un slot doit DÉBORDER de sa colonne — sinon le
   défilement de la colonne le coupait net (constat Boris 2026-07-23). */
.topic-cols.slot-ouvert{overflow:visible;}
.topic-col.slot-ouvert{overflow:visible;}
.topic-col.slot-ouvert ul{overflow:visible;}
.slot-menu.vers-haut{top:auto;bottom:calc(100% - 2px);}
/* Couleur + émoji d'un bloc de piste ANNEXE (N°176) : deux encadrés côte à côte,
   même gabarit que la ligne Durée/Quota de la modale. */
.ef-annexe{display:flex;gap:10px;align-items:flex-start;}
/* Le libellé « Émoji (facultatif) » passait à la ligne sous un champ de 72 px et
   décalait les deux encadrés l'un par rapport à l'autre (vu au rendu). */
.ef-annexe label{white-space:nowrap;}
.ef-annexe .ef-fac{font-weight:400;opacity:.7;}
.ef-annexe input[type="color"]{width:56px;height:32px;padding:2px;}
.ef-annexe input[type="text"]{width:72px;text-align:center;font-size:16px;}

/* ---------- Vacances : un TROU dans la grille (N°178) ----------
   La barre violette du N°157 vivait dans le seul en-tête : elle ne disait rien
   là où le prof regarde. La coupure est désormais un vide de la largeur d'UNE
   colonne, de la ligne des mois à la dernière piste — sa durée n'est plus
   dessinée mais ÉCRITE dans son libellé (décision Boris). */
.cal-grid .seg-rangee{display:flex;}
.cal-grid .gout{flex:0 0 auto;width:var(--col-w);background:transparent;}
/* Sans ce trait, la 1re colonne après un trou flotte, ouverte à gauche. */
.cal-grid .reprise{border-left:1px solid var(--grid-line);}
.cal-grid .months .reprise{border-left:2px solid var(--accent-bord);}
/* Une piste ne doit PAS être décalée par ce trait (Boris, 04/10 : traits et cases 1 px à
   droite de l'en-tête après chaque vacance) : trait dessiné en ombre intérieure, la grille
   et les blocs gardent leur origine. */
.cal-grid .piste.reprise{border-left:0;box-shadow:inset 1px 0 0 var(--grid-line);}
.cal-grid .gout-lbl{position:absolute;top:0;bottom:0;z-index:4;cursor:help;
  display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap;
  overflow:hidden;gap:3px;
  font-size:8.5px;font-weight:700;letter-spacing:.03em;color:color-mix(in srgb, var(--violet) 70%, var(--card));}
/* En écriture verticale, l'axe principal du flex est la HAUTEUR : c'est donc le
   nom qui se rétrécit (min-height:0 lève le minimum auto), la durée jamais. */
.cal-grid .gout-lbl .gl-nom{min-height:0;overflow:hidden;text-overflow:ellipsis;}
.cal-grid .gout-lbl .gl-dur{flex:none;font-weight:600;opacity:.85;}
/* Morceau d'un bloc découpé dont le titre a déjà été montré en entier (N°178) :
   une flèche, jamais le mot « suite ». */
.cal-grid .bloc .bl-fleche{opacity:.75;font-weight:400;}

/* ---------- Jour sans cours (N°179) : férié, PTC, sortie ----------
   La colonne RESTE dessinée — c'est le comptage qui l'exclut — et se marque SUR
   LES PISTES seulement : l'en-tête doit rester lisible.
   Trame FINE et espacée, dans le bleu des semaines B, sur fond transparent : la
   grosse hachure grise du premier jet pesait autant qu'un bloc alors qu'elle ne
   dit qu'une absence (retour Boris).
   Une SEULE nappe couvre toutes les pistes (et non une par piste) : la phase
   d'un dégradé à 135° dépend de son origine, donc une nappe par piste se
   décalait à chaque changement de hauteur de rangée. */
/* La trame est un CARREAU de 12 px qui se raccorde à lui-même (un trait par coin et un
   par l'anti-diagonale), calé sur l'origine de la grille par le JS (background-position) :
   une colonne la continue au lieu de la redémarrer. --trait = demi-épaisseur en %
   de la diagonale du carreau (17 px) : 3 % ≈ 1 px. */
.cal-grid .sans-cours{position:absolute;top:0;bottom:0;z-index:3;cursor:help;
  --hachure:var(--weekB);--trait:3%;background-size:12px 12px;
  background-image:linear-gradient(135deg,var(--hachure) 0 var(--trait),transparent var(--trait) calc(50% - var(--trait)),
    var(--hachure) calc(50% - var(--trait)) calc(50% + var(--trait)),transparent calc(50% + var(--trait)) calc(100% - var(--trait)),
    var(--hachure) calc(100% - var(--trait)));}
/* Événements de l'ÉTABLISSEMENT (incr. 5b) : une nappe TRANSLUCIDE surmontée
   d'un liseré de couleur. Translucide et non hachurée, pour ne pas se confondre
   avec un jour sans cours — un événement ne retire pas la colonne, il se pose
   dessus. Le liseré en haut le rend repérable sans masquer les blocs. */
.cal-grid .evt-etab{position:absolute;top:0;bottom:0;z-index:4;cursor:help;
  border-top:5px solid var(--evt-c,var(--muted));
  border-left:1px dashed var(--evt-c,var(--muted));border-right:1px dashed var(--evt-c,var(--muted));
  background:var(--evt-bg,color-mix(in srgb, var(--muted) 20%, transparent));}
/* Couleurs par type, définies HORS `.cal-grid` : la pastille de légende vit
   ailleurs dans le DOM et doit hériter des mêmes variables — sinon elle sort
   grise, et une légende grise n'explique aucune couleur. */
.evt-mock{--evt-c:var(--cat-orange);--evt-bg:color-mix(in srgb, var(--cat-orange) 20%, transparent);}
.evt-examen{--evt-c:var(--cat-violet);--evt-bg:color-mix(in srgb, var(--cat-violet) 20%, transparent);}
.evt-reunion{--evt-c:var(--cat-vert);--evt-bg:color-mix(in srgb, var(--cat-vert) 18%, transparent);}
/* Bloc HEURTÉ par une date d'établissement. Le vocabulaire visuel est déjà pris :
   anneau plein = conflit entre blocs, rayures = débordement. Ici, un liseré
   POINTILLÉ — troisième signal, distinct des deux autres, et lisible sur
   n'importe quelle couleur de bloc. La nuance de sens compte : dans un conflit
   le prof s'est trompé ; ici, une date qu'il ne décide pas tombe sur son travail. */
.cal-grid .bloc.heurte-etab{outline:2px dashed var(--danger);outline-offset:-3px;}
/* Pastille de légende pour un type d'événement (même code couleur que la nappe). */
.tl-legend .swatch-evt{background:var(--evt-bg,var(--fond-gris));border:2px solid var(--evt-c,var(--muted));}
/* 4e cadre de Configuration : jours sans cours (N°179). Deux colonnes — date et
   info facultative ; le jour de la semaine est dérivé, jamais saisi. */
.jsc-pastille{width:8px;height:8px;border-radius:2px;flex:none;
  background:repeating-linear-gradient(135deg,var(--muted) 0 2px,var(--fond-gris) 2px 4px);}
.jsc-date{flex:0 0 auto;font-size:13px;font-weight:600;}
.jsc-date .jsc-dow{color:var(--muted);font-weight:400;font-size:11.5px;}
.jsc-info{flex:1;min-width:0;font-size:13px;color:var(--nuit);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.jsc-info.vide{color:var(--muted);font-style:italic;}

/* Page ANNÉE (v2) COMPACTE : tout tient sur l'écran, sans défilement. Grille à
   3 colonnes — Paramètres puis Jours sans cours empilés à gauche, Périodes et
   Vacances sur toute la hauteur. Polices, champs et marges resserrés ; les
   paramètres passent sur 2 colonnes. Posée APRÈS les règles `.cfg-*` : elle les
   surcharge dans `.cfg-annee` seulement (la page Types de bloc ne change pas). */
.cfg-annee{display:grid;grid-template-columns:minmax(230px,.85fr) minmax(300px,1.15fr) minmax(380px,1.5fr);
  gap:10px;align-items:start;font-size:12.5px;}
.cfg-annee>.card{padding:9px 11px;margin:0;min-width:0;}
.cfg-annee .cfg-card-cours{grid-column:1 / -1;grid-row:1;}
.cfg-annee .cfg-card-params{grid-column:1;grid-row:2;}
.cfg-annee .cfg-card-jsc{grid-column:1;grid-row:3;}
.cfg-annee .cfg-card-periodes{grid-column:2;grid-row:2 / span 2;}
.cfg-annee .cfg-card-vacances{grid-column:3;grid-row:2 / span 2;}
/* N°356 : la carte « 1 · Cours », sur toute la largeur — la liste, puis ses cases et ses élèves en lecture. */
.cfg-cours-corps{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;}
.cfg-annee .cfg-cours-corps select{width:320px;max-width:100%;}
.cfg-cours-lu{font-size:13px;}
.cfg-cours-lu .sub{margin-right:6px;}
.cfg-annee .cfg-cells .cell.cfg-seances-edt{grid-column:1 / -1;}
.cfg-annee h3{font-size:14px;margin:0 0 6px !important;}
.cfg-annee .cfg-card-tete{margin-bottom:6px;}
.cfg-annee .cfg-add-btn{width:22px;height:22px;}
.cfg-annee label{font-size:11.5px;margin:0 0 2px;}
.cfg-annee input[type=text],.cfg-annee input[type=number],.cfg-annee input[type=date],
.cfg-annee select{padding:3px 7px;font-size:12.5px;height:28px;box-sizing:border-box;}
.cfg-annee .cfg-ligne{gap:5px;margin-bottom:4px !important;}
.cfg-annee .cfg-ligne input[type=date]{width:118px;}
.cfg-annee .cfg-card-periodes .cfg-ligne input[type=date]{width:118px !important;}
.cfg-annee .cfg-card-periodes input[name^=court_]{width:44px !important;}
.cfg-annee .cfg-card-periodes input[name^=nom_]{min-width:60px !important;}
.cfg-annee .cfg-add-row{padding:5px;margin-top:4px;}
.cfg-annee .cfg-cells{display:grid;grid-template-columns:1fr 1fr;gap:5px 8px;}
.cfg-annee .cfg-cells .cell{min-width:0;}
.cfg-annee .cfg-cells .cell.rot-off{grid-column:1 / -1;}
.cfg-annee .cfg-card-periodes>div[style*="margin-top"]{margin-top:6px !important;display:flex;align-items:center;gap:8px;}
.cfg-annee .cfg-card-periodes>div[style*="margin-top"] label{margin:0;white-space:nowrap;}
.cfg-annee .jsc-date{font-size:12px;}
.cfg-annee .jsc-info{font-size:12px;}
.cfg-annee p.muted{margin:0 0 4px;font-size:12px !important;}
.cfg-annee .cfg-suppr{min-width:22px;min-height:22px;padding:3px;}

/* ── Espace « Mes classes » (noyau, incr. 193) ────────────────────────────────
   Les cartes de la liste ne vivent PLUS ici : elles ont fusionné avec celles des
   progressions dans `.sel-carte` (décision Boris 2026-08-01). Ce qui suit est
   propre à la page d'UNE classe. */

/* Page d'une classe : QUATRE blocs, et l'ajout à côté de la liste — un formulaire
   de trois champs étiré sur toute la largeur laisse la page aux trois quarts vide. */
.classe-entete{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 16px;margin-bottom:14px;}
.classe-meta{display:flex;gap:14px;color:var(--muted);font-size:14px;flex-wrap:wrap;}
.classe-code{display:flex;align-items:baseline;gap:8px;}
.classe-code-lbl{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em;}
.classe-code-val{font-size:18px;letter-spacing:.08em;}
.classe-grille{display:grid;grid-template-columns:minmax(280px,360px) 1fr;gap:14px;
  align-items:start;}
.classe-titre-bloc{margin:0 0 12px;font-size:15px;}
.classe-form label{display:block;margin:0 0 4px;font-size:13px;color:var(--muted);}
.classe-form input,.classe-form textarea,.classe-form select{width:100%;margin-bottom:10px;}
.classe-form-duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.classe-td-action{text-align:right;width:1%;white-space:nowrap;}
/* Administration › Classes (N°389) : les cours d'une classe, l'un sous l'autre ; matière + titulaire côte à côte. */
.adm-cours{display:flex;flex-direction:column;gap:2px;}
.adm-duo{display:flex;gap:8px;}
/* La page d'une année d'école (N°389) : vacances, événements, trimestres côte à côte — un écran. */
.classe-grille.grille-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.td-court{white-space:nowrap;}
/* Rattacher une de mes classes (N°390) : l'encadré « ne bouge pas / change / définitif », l'homonyme à trancher. */
.adm-encadre{padding:9px 14px;margin-top:12px;border-radius:8px;}
.adm-doublon td{background:var(--danger-fond);}
.adm-choix label{display:flex;gap:8px;align-items:flex-start;margin:4px 0;font-weight:400;}
.adm-choix input{width:auto;margin-top:3px;}
.adm-pied{display:flex;gap:8px;justify-content:flex-end;margin-top:10px;}
/* Équipe (N°391) : les gestes d'un membre côte à côte. */
.adm-geste{display:inline;}
/* Lecture d'administration (N°392 a, maquette état 6) : le bandeau au-dessus de la page. */
.adm-bandeau{padding:9px 14px;margin-bottom:12px;border-radius:8px;}
/* Liste des élèves d'une classe : lignes serrées (même recette que `.mem-test-lot`). */
.classe-eleves td{padding-top:3px;padding-bottom:3px;}
.classe-eleves .btn-sm{padding:2px 8px;}
/* `.classe-nouveau` / `.adresse-en-grand` retirés le 2026-08-01 (décision Boris) :
   le pavé « vérifie l'adresse avec l'élève » ne s'installe plus dans le
   formulaire, la confirmation passe par un flash. */
/* `.classe-danger` retiré le 24/10/2026 (N°321) : la suppression vit dans les réglages (l'engrenage). */
.tl-dialog .classe-code{margin-top:4px;}
@media (max-width:900px){.classe-grille,.classe-grille.grille-3{grid-template-columns:1fr;}}

/* ── Mémorisation (outil 3, tranche 1) ───────────────────────────────────────
   La scène d'une session : une question à l'écran, rien d'autre à décider. */
.mem-scene{max-width:760px;}
.mem-avancement{color:var(--muted);font-size:12px;text-transform:uppercase;
  letter-spacing:.04em;margin-bottom:10px;}
.mem-enonce{font-size:19px;line-height:1.45;margin:0 0 18px;color:var(--ink);}
.mem-choix{display:grid;gap:8px;margin-bottom:14px;}
.mem-choix-btn{text-align:left;justify-content:flex-start;}
/* Un bouton désactivé est pâle par défaut : la réponse choisie doit rester
   PARFAITEMENT lisible, sinon la correction immédiate ne corrige rien. */
.mem-choix-btn:disabled{opacity:1;}
.mem-choix-btn.mem-juste:disabled{border-color:var(--ok);background:var(--ok-fond);color:var(--ok-texte);
  font-weight:500;}
.mem-choix-btn.mem-faux:disabled{border-color:var(--danger);background:var(--danger-fond);color:var(--danger-texte);
  font-weight:500;}
/* N°295 (audit n° 14) : juste/faux ne se dit plus par la COULEUR SEULE (daltonisme) —
   un symbole en tête du choix et une bordure plus épaisse, sans ajouter de texte à lire. */
.mem-choix-btn.mem-juste:disabled,.mem-choix-btn.mem-faux:disabled{border-width:2px;}
.mem-choix-btn.mem-juste:disabled::before{content:"✓";font-weight:700;margin-right:8px;}
.mem-choix-btn.mem-faux:disabled::before{content:"✗";font-weight:700;margin-right:8px;}
/* L'annonce pour un lecteur d'écran : lue, jamais vue. */
.mem-annonce{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap;}
.mem-verdict{font-weight:500;margin-bottom:12px;}
.mem-juste-txt{color:var(--ok-texte);} .mem-faux-txt{color:var(--danger-texte);}
/* Correction expliquée (N°282, retour de Boris du 20/10) : les couleurs des choix
   disent juste/faux ; seule l'EXPLICATION s'affiche, sur fond bleu. */
.mem-correction{margin-bottom:12px;background:var(--accent-pale);color:var(--nuit);border-radius:8px;
  padding:10px 14px;display:flex;flex-direction:column;gap:6px;}
.mem-correction[hidden]{display:none;}   /* sinon `display:flex` l'emporte sur [hidden] */
.mem-explication{margin:0;}
/* « Question suivante » à droite ; Signaler et Quitter vivent dans le menu « ⋯ ». */
.mem-pied{display:flex;justify-content:flex-end;}
.mem-tete{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.mem-tete .mem-avancement{margin:0;white-space:nowrap;}
.mem-barre{flex:1;height:6px;background:var(--line);border-radius:999px;overflow:hidden;}
.mem-barre > span{display:block;height:100%;width:0;background:var(--accent);
  border-radius:999px;transition:width .25s;}
.mem-plus{position:relative;}
.mem-plus > summary{list-style:none;cursor:pointer;padding:0 8px;border-radius:6px;
  color:var(--muted);font-size:20px;line-height:26px;}
.mem-plus > summary::-webkit-details-marker{display:none;}
.mem-plus > summary:hover,.mem-plus[open] > summary{background:var(--accent-pale);color:var(--ink);}
.mem-plus > summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.mem-plus-pop{position:absolute;right:0;top:calc(100% + 4px);z-index:60;min-width:210px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 8px 24px color-mix(in srgb, var(--nuit) 18%, transparent);padding:6px;}
.mem-plus-pop > button,.mem-plus-pop > a{display:block;width:100%;text-align:left;border:none;
  background:none;font:inherit;font-size:14px;padding:6px 10px;border-radius:6px;
  color:var(--ink);text-decoration:none;cursor:pointer;}
.mem-plus-pop > button:hover,.mem-plus-pop > a:hover{background:var(--accent-pale);}
.mem-zone-json{width:100%;font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,monospace);
  font-size:12.5px;margin-bottom:10px;}
/* Étiquettes de la carte de maîtrise : « jamais joué » doit se voir de loin. */
.mem-etat{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;}
.mem-solide{background:var(--ok-fond);color:var(--ok-texte);}
.mem-fragile{background:var(--alerte-fond);color:var(--alerte-texte);}
.mem-en-progres{background:var(--ok-fond);color:var(--ok-texte);}
.mem-a-revoir{background:var(--accent-pale);color:var(--nuit);}
.mem-jamais-joue{background:var(--fond-gris);color:var(--muted);}

/* ── Accueil de la Mémorisation = tableau de bord du prof (Boris 2026-08-01) ──
   Trois cadres : ① messages pleine largeur (il s'adresse à toute la page),
   ② les classes (le tableau, donc la place), ③ les chiffres (une colonne
   étroite suffit). La grille passe à une colonne quand la fenêtre se resserre :
   un tableau à six colonnes ne se comprime pas indéfiniment. */
.memo-messages{display:flex;flex-direction:column;gap:8px;}
.memo-msg{margin:0;}
.memo-accueil-grille{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:14px;
  align-items:start;}
@media (max-width:1100px){.memo-accueil-grille{grid-template-columns:1fr;}}
/* Titre à gauche, « + » à droite : le moule d'une tête de cadre qui agit. */
.memo-carte-tete{display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:12px;}
/* Le nom de classe en BULLE : c'est un lien, il doit s'en voir. */
.memo-bulle-classe{text-decoration:none;font-weight:500;transition:filter .12s;}
.memo-bulle-classe:hover{filter:brightness(.95);}
/* Ligne ENTIÈRE cliquable (Boris 2026-08-01) : le survol doit le dire, sinon la
   zone active est invisible et le clic passe pour un accident. */
.memo-ligne-classe{cursor:pointer;transition:background .12s;}
.memo-ligne-classe:hover{background:var(--fond-doux);}
/* Un bouton qui porte un libellé ET une icône : l'icône se cale sur le texte. */
.btn-avec-ico{display:inline-flex;align-items:center;gap:6px;}
/* Un chiffre par ligne, gros, son nom dessous en petit : lisible au coup d'œil. */
.memo-stats{display:flex;flex-direction:column;gap:2px;}
.memo-stat{display:block;padding:8px 0;text-decoration:none;color:inherit;
  border-top:1px solid var(--line-doux);}
.memo-stat:first-of-type{border-top:none;}
a.memo-stat:hover .memo-stat-nb{color:var(--accent);}
.memo-stat-nb{display:block;font-size:22px;font-weight:600;color:var(--ink);line-height:1.1;}
/* Une date n'est pas un nombre : même place, taille réduite pour rester lisible. */
.memo-stat-date{font-size:15px;}
.memo-stat-lbl{display:block;font-size:12px;color:var(--muted);}

/* ── Cadre « Savoirs » de Ma banque (Boris 2026-08-01) ──────────────────────
   Ligne de filtres + tableau à colonnes FIXÉES. Sans largeurs imposées, le
   navigateur répartit au contenu : « À revoir le » se repliait sur deux lignes
   pendant qu'un intitulé long s'étalait. Ici chaque colonne a sa part, et ce
   qui dépasse est TRONQUÉ (« … »), jamais replié — une ligne = un savoir. */
.mem-filtres{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
/* `select{width:100%}` est global (ligne ~137) : sans le neutraliser ici, chaque
   contrôle prend toute la largeur et la « ligne » de filtres devient une pile. */
.mem-filtres select{width:auto;flex:0 0 auto;max-width:220px;}
/* Le champ de recherche n'était couvert par aucune règle : il gardait l'aspect
   natif du navigateur, étranger au reste du site. */
.mem-f-texte{flex:0 1 260px;min-width:0;width:auto;padding:7px 10px;
  border:1px solid var(--bord,var(--line));border-radius:8px;font:inherit;color:inherit;
  background:var(--card);}
.mem-f-texte:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);}
.mem-table-savoirs{table-layout:fixed;width:100%;}
.mem-table-savoirs th,.mem-table-savoirs td{overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;}
.mem-table-savoirs th:nth-child(1),.mem-table-savoirs td:nth-child(1){width:34%;}
.mem-table-savoirs th:nth-child(2),.mem-table-savoirs td:nth-child(2){width:20%;}
.mem-table-savoirs th:nth-child(3),.mem-table-savoirs td:nth-child(3){width:9%;}
.mem-table-savoirs th:nth-child(4),.mem-table-savoirs td:nth-child(4){width:11%;}
.mem-table-savoirs th:nth-child(6),.mem-table-savoirs td:nth-child(6){width:11%;}
/* « À revoir le » : assez large pour la date ET l'en-tête sur UNE ligne, au
   prix d'une police réduite — c'est la colonne la moins consultée des six. */
.mem-col-date{width:15%;font-size:12px;}
/* Un en-tête triable doit s'annoncer, et sa flèche dire le sens en cours. */
.mem-th-triable{cursor:pointer;user-select:none;}
.mem-th-triable:hover{color:var(--ink);}
.mem-th-triable.tri-asc::after{content:" ▲";font-size:9px;}
.mem-th-triable.tri-desc::after{content:" ▼";font-size:9px;}
/* Sous-titre d'un cadre qui rassemble plusieurs tableaux (Chapitre). */
.mem-sous-titre{margin:18px 0 8px;font-size:14px;color:var(--ink);}
/* « Ma banque » (N°301) : l'arbre de couverture niveau › matière › chapitre › notion › savoir.
   Maquette `memorisation_ma_banque_2026-10-21.html`. */
.mem-cv-tete{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.mem-cv-global{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;}
.mem-cv-droite{margin-left:auto;display:flex;align-items:center;gap:8px;}
.mem-cv-bascule{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);cursor:pointer;margin:0;}
.mem-cv-bascule input{width:auto;margin:0;accent-color:var(--accent);}
/* Le « + » d'ajout du site (`.btn.btn-ico.btn-ajout`, comme « Mes progressions ») porté par
   le `summary` du menu : on neutralise ce que `.mem-plus > summary` (le « ⋯ ») impose. */
.mem-ajouter > summary.btn-ajout{color:var(--blanc);font-size:inherit;line-height:0;padding:6px 8px;}
.mem-ajouter > summary.btn-ajout:hover,.mem-ajouter[open] > summary.btn-ajout{background:var(--accent-dark);color:var(--blanc);}
.mem-cv-droite .mem-f-texte{flex:0 1 200px;min-width:120px;height:32px;box-sizing:border-box;}
/* Une seule hauteur pour la ligne (champ, « Tout déplier », « + ») : 32 px, mesurés. */
.mem-cv-droite > .btn{height:32px;box-sizing:border-box;}
.mem-ajouter > summary.btn-ajout{width:32px;height:32px;box-sizing:border-box;padding:0;}
/* Les libellés ne se replient jamais (« Tout déplier » passait sur 2 lignes) : c'est le
   champ de filtre qui cède la place. */
.mem-cv-droite > label,.mem-cv-droite > .btn{white-space:nowrap;flex-shrink:0;}
.mem-ajouter .mem-plus-pop{min-width:250px;}
.mem-ajouter .mem-plus-pop .sub{display:block;font-size:11px;}
.mem-jauge{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap;flex-shrink:0;}
.mem-jauge-barre{width:70px;height:6px;background:var(--fond-gris);border-radius:3px;overflow:hidden;}
.mem-jauge-barre > i{display:block;height:100%;background:var(--ok);}
.mem-jauge-partiel .mem-jauge-barre > i{background:var(--alerte);}
.mem-jauge-vide .mem-jauge-barre > i{background:var(--danger);}
.mem-jauge b{color:var(--ink);font-weight:600;}
.mem-cv-arbre{margin-top:12px;}
.mem-cv-arbre summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:6px;}
.mem-cv-arbre summary::-webkit-details-marker{display:none;}
.mem-cv-arbre summary:hover{background:var(--fond-doux);}
.mem-cv-arbre summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.mem-cv-chev{width:12px;color:var(--muted);font-size:11px;transition:transform .15s;flex-shrink:0;}
.mem-cv-arbre details[open] > summary > .mem-cv-chev{transform:rotate(90deg);}
.mem-cv-arbre details[hidden]{display:none;}
/* Niveau › matière › chapitre › notion (22/10) : un retrait de 22 px par étage. */
.mem-cv-niveau > summary{font-weight:700;font-size:15px;border-top:1px solid var(--line);border-radius:0;padding-top:9px;}
.mem-cv-niveau:first-child > summary{border-top:0;}
.mem-cv-matiere > summary{font-weight:600;padding-left:26px;}
.mem-cv-chap > summary{font-weight:500;padding-left:48px;}
.mem-cv-notion > summary{padding-left:70px;font-size:13px;}
.mem-cv-gauche{display:flex;align-items:center;gap:8px;min-width:0;flex:1;}
.mem-cv-lib{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.mem-cv-note{font-size:12px;color:var(--muted);font-weight:400;}
.mem-cv-savoirs{margin:2px 0 6px 94px;border-left:2px solid var(--line-doux);}
.mem-cv-sav{display:grid;grid-template-columns:minmax(0,1fr) 118px auto;gap:4px 12px;align-items:start;
  padding:6px 10px;border-bottom:1px solid var(--line-doux);border-radius:4px;transition:box-shadow .3s,background .3s;}
.mem-cv-sav:last-child{border-bottom:0;}
.mem-cv-sav[hidden]{display:none;}
.mem-cv-intit{font-size:13px;}
.mem-cv-aussi{font-size:11px;color:var(--muted);margin-left:6px;}
.mem-cv-nbq{font-size:12px;text-align:right;padding-top:1px;}
.mem-cv-zero{color:var(--danger);font-weight:600;}
.mem-cv-bout{grid-row:1 / 3;grid-column:3;align-self:center;}
.mem-cv-ajout{margin:2px 0 8px 94px;}
.mem-cv-liens{grid-column:1 / 2;display:flex;flex-wrap:wrap;gap:4px;}
.mem-cv-halo{background:var(--alerte-fond);box-shadow:0 0 0 2px var(--alerte) inset;}
/* Les étiquettes de prérequis — mêmes teintes que « pré-requis » du Programme v2. */
.mem-et{font:inherit;font-size:11px;border-radius:10px;padding:1px 8px;cursor:pointer;border:1px solid;
  max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mem-et-pre{color:var(--alerte-texte);background:var(--alerte-fond);border-color:var(--alerte-bord);}
.mem-et-sert{color:var(--accent);background:var(--fond-gris);border-color:var(--line-fort);}
.mem-et:hover{text-decoration:underline;}
.mem-et:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.mem-dlg-large{width:560px;max-width:calc(100vw - 32px);}
/* « Ma propre mémoire » dans Tester (N°301) : 23 lignes faisaient 1,63 écran. Le tableau
   défile dans son cadre (motif du Suivi), l'en-tête reste visible. 600 px = ce qui le
   précède dans la page (mesuré à 1440 × 900 : il commence à 539 px). */
.mem-carte-defile{max-height:max(220px,calc(100vh - 600px));overflow:auto;}
.mem-carte-defile thead th{position:sticky;top:0;background:var(--card);z-index:1;}

/* File de relecture (signalements + quarantaines) et volet d'écriture. */
/* Pas de marge propre : l'espacement vient de `.pile`, comme partout ailleurs. */
.mem-sig-tete{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.mem-sig-enonce{font-size:16px;margin:0 0 6px;color:var(--ink);}
.mem-sig-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;}
.mem-sig-rejet{display:flex;gap:6px;flex:1 1 320px;}
.mem-sig-rejet input{flex:1;}
.mem-ecrire{max-width:720px;}
.mem-ecrire-aide{margin:14px 0 8px;}
.mem-ecrire-duo{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:10px;margin-bottom:10px;}
/* N°293 : la bonne réponse d'un vrai/faux = deux boutons radio sur une ligne (la règle
   `.classe-form input` les étirait sur toute la largeur). */
.mem-ecrire-vf{border:0;padding:0;margin:0 0 10px;min-width:0;}
.mem-ecrire-vf legend{padding:0;margin:0 0 4px;font-size:13px;color:var(--muted);}
.classe-form .mem-ecrire-vf label{display:inline-flex;align-items:center;gap:6px;margin:0 24px 0 0;font-size:14px;color:var(--ink);cursor:pointer;}
.classe-form .mem-ecrire-vf input{width:auto;margin:0;}

/* ---------- L'encadré des séances (étape ③, incr. 4a) — le cahier de texte ----------
   Sous la bande d'une période : une séance à la fois, deux colonnes, tout sur une page
   (la hauteur est posée par encadre.js : ce qui reste de la fenêtre). */
.encadre-seances{margin-top:10px;background:var(--card);border:1px solid var(--line);border-radius:10px;
  display:flex;flex-direction:column;overflow:hidden;}
/* Les séances de la séquence en onglets (04/10/2026) : une seule ligne, toute la largeur,
   « N°/total : Titre … durée » ; le titre se tronque, l'onglet choisi s'élargit. */
.enc-tete{display:flex;align-items:stretch;gap:2px;padding:8px 14px 0;border-bottom:1px solid var(--line);flex-shrink:0;}
.enc-seance{flex:1 1 0;display:flex;align-items:center;gap:5px;min-width:0;border:1px solid transparent;border-bottom:0;
  border-radius:7px 7px 0 0;padding:6px 10px;margin-bottom:-1px;background:var(--fond-doux);font:inherit;font-size:13px;
  color:var(--muted);text-align:left;cursor:pointer;}
.enc-seance:hover{background:var(--fond-gris);color:var(--ink);}
.enc-seance .n{font-variant-numeric:tabular-nums;white-space:nowrap;}
.enc-seance .t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.enc-seance .t.vide{font-style:italic;}
.enc-seance .d{font-size:12px;white-space:nowrap;}
.enc-seance.on{flex-grow:1.8;background:var(--card);border-color:var(--line);color:var(--ink);cursor:default;
  box-shadow:inset 0 2px 0 var(--accent);}
.enc-seance.on .n{color:var(--accent);font-weight:600;}
.enc-titre{flex:1;min-width:60px;font:inherit;font-size:13px;font-weight:600;color:var(--ink);border:1px solid transparent;
  border-radius:4px;padding:1px 5px;background:transparent;}
.enc-titre:hover,.enc-titre:focus{border-color:var(--accent-bord);background:var(--card);}
/* Gestes sur la séance (séances à leur place, étape 3) : décaler à gauche / à droite, verrou. */
.enc-geste{border:0;background:none;color:var(--muted);cursor:pointer;padding:1px 4px;border-radius:4px;font-size:13px;line-height:16px;}
.enc-geste:hover{color:var(--ink);background:var(--accent-pale);}
.enc-geste.on{background:var(--fond-gris);color:var(--nuit);}
.enc-verrou{font-size:11px;opacity:.75;}
/* Menu des gestes sur une séance (même apparence que le menu d'un bloc). */
.enc-menu{min-width:240px;z-index:1000;}
.enc-menu .bloc-menu-item.danger{color:var(--danger);}
.enc-lettre{display:inline-grid;place-items:center;min-width:16px;height:16px;border-radius:4px;background:var(--accent-pale);color:var(--accent);font-size:10px;font-weight:700;margin-right:4px;flex:0 0 auto;}
.enc-menu-durees{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding:6px 10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px;}
.enc-menu-durees span{color:var(--muted);margin-right:4px;}
.enc-duree{border:1px solid var(--line);background:var(--card);border-radius:4px;padding:2px 7px;font-size:12px;cursor:pointer;}
.enc-duree:hover{border-color:var(--accent);}
.enc-duree.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);}
.enc-bascule{border:1px solid var(--accent-bord);background:var(--card);border-radius:999px;padding:2px 11px;font:inherit;font-size:12px;
  color:var(--muted);cursor:pointer;}
.enc-bascule.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);}
.enc-bascule.orange.on{background:var(--alerte);border-color:var(--alerte);}
.enc-corps{flex:1;min-height:0;display:grid;grid-template-columns:1.1fr 1fr;gap:10px;padding:10px 14px 12px;}
/* L'onglet « Séquence » (N°273) : seul sur sa ligne, au-dessus des séances ; choisi, un seul
   cadre (les documents de la séquence entière) prend toute la largeur. */
.enc-tete-seq{border-bottom:0;padding-bottom:2px;}
.enc-onglet-seq{flex:0 1 auto;max-width:70%;border-radius:7px;margin-bottom:0;border-bottom:1px solid transparent;}
.enc-onglet-seq.on{flex-grow:0;border-bottom-color:var(--line);cursor:pointer;}
.enc-seq-mot{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);}
.enc-corps-seq{grid-template-columns:1fr;}
.enc-fichiers-seq{margin-left:0;}
.enc-fichiers-seq li{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px dashed var(--line-doux);font-size:13px;}
.enc-joindre-seq{margin-top:8px;border:0;background:none;padding:2px 0;font:inherit;font-size:13px;color:var(--accent);cursor:pointer;}
.enc-joindre-seq:hover{text-decoration:underline;}
.enc-corps-seq .enc-vide{color:var(--muted);font-size:13px;margin:4px 0;}
.enc-cadre-tete{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px;}
.enc-cadre-tete h3{margin:0;}
/* La colonne de droite en onglets (04/10/2026) : un cadre, quatre panneaux. */
.enc-droite{padding-top:0;}
.enc-onglets{display:flex;align-items:flex-end;gap:2px;border-bottom:1px solid var(--line);margin:0 -10px 6px;padding:0 6px;flex-shrink:0;}
.enc-onglets button{border:0;border-bottom:2px solid transparent;background:none;font:inherit;font-size:12px;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:7px 8px 5px;cursor:pointer;}
.enc-onglets button:hover{color:var(--ink);}
.enc-onglets button.on{color:var(--accent);border-bottom-color:var(--accent);}
.enc-onglets .enc-etat{align-self:center;margin-left:auto;font-size:11px;color:var(--muted);}
.enc-panneau{flex:1;min-height:0;display:flex;flex-direction:column;}
.enc-panneau[hidden]{display:none;}
.enc-cadre{border:1px solid var(--line);border-radius:8px;padding:5px 10px 6px;min-height:0;display:flex;flex-direction:column;}
.enc-cadre h3{margin:0 0 4px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.enc-defile{flex:1;min-height:0;overflow:auto;}
.enc-cadre textarea{flex:1;min-height:36px;width:100%;font:inherit;font-size:13px;border:1px solid var(--line-fort);border-radius:6px;
  padding:5px 8px;resize:none;}
.enc-etapes,.enc-taches{list-style:none;margin:0;padding:0;}
.enc-etapes li,.enc-taches li{display:flex;align-items:center;gap:8px;padding:3px 0;border-bottom:1px dashed var(--line-doux);font-size:13px;}
.enc-etapes .r{color:var(--muted);font-size:12px;width:18px;text-align:right;flex:0 0 18px;}
.enc-etapes .t,.enc-taches .t{flex:1;}
.enc-etapes li.pasfaite .t{color:var(--alerte);}
.enc-etape-t{width:100%;font:inherit;color:inherit;border:1px solid transparent;border-radius:4px;background:transparent;padding:1px 4px;margin-left:-5px;}
.enc-etape-t:hover,.enc-etape-t:focus{border-color:var(--accent-bord);background:var(--card);outline:none;}
.enc-taches .t.faite{color:var(--muted);}
.enc-x{visibility:hidden;border:0;background:none;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:0 4px;}
.enc-etapes li:hover .enc-x,.enc-taches li:hover .enc-x{visibility:visible;}
/* Les documents d'une étape (09/10/2026) : le 📎 discret, plein au survol de la ligne. */
.enc-attacher{border:0;background:none;cursor:pointer;font-size:13px;line-height:1;padding:0 2px;opacity:.35;}
.enc-etapes li:hover .enc-attacher,.enc-attacher:focus-visible{opacity:1;}
.enc-docs{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 1px;}
.enc-doc{display:inline-flex;align-items:center;font-size:12px;background:var(--fond-doux);border:1px solid var(--line-fort);border-radius:10px;padding:0 2px 0 8px;}
.enc-doc a{color:var(--accent);text-decoration:none;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.enc-doc a:hover{text-decoration:underline;}
.enc-doc .enc-x{font-size:13px;}
.enc-doc:hover .enc-x{visibility:visible;}
/* Une tâche d'impression (N°263) : le fichier à ouvrir et « × n », puis son réglage dessous. */
/* L'encadré réagencé (N°263, maquette du 10/10) : tout s'aligne sur la 1re ligne ; les
   gestes passent dans « ⋯ » (visible au survol) ; les fichiers sont des liens, pas des bulles. */
.enc-etapes li.enc-ligne,.enc-taches li.enc-ligne{align-items:flex-start;flex-wrap:wrap;}
.enc-ligne .r,.enc-ligne > input[type=checkbox]{margin-top:3px;}
.enc-geste-ligne{opacity:.35;margin-top:1px;}
.enc-ligne:hover .enc-geste-ligne,.enc-geste-ligne:focus-visible,.enc-ligne.ouverte .enc-geste-ligne{opacity:1;}
.enc-etape-tete{display:flex;align-items:center;gap:6px;}
.enc-plier{display:block;border:0;background:none;padding:1px 0;margin:1px 0 0;font:inherit;font-size:12px;color:var(--muted);cursor:pointer;}
.enc-plier:hover{color:var(--accent);}
.enc-fichiers{list-style:none;margin:2px 0 2px 12px;padding:0;}
.enc-etapes .enc-fichiers li{border:0;padding:1px 0;gap:4px;}
.enc-fichier{color:var(--accent);text-decoration:none;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.enc-fichier:hover{text-decoration:underline;}
.enc-fichiers li:hover .enc-x{visibility:visible;}
.enc-sous-titre{display:block !important;border:0 !important;padding:8px 0 2px !important;font-size:11.5px !important;
  font-weight:700;letter-spacing:.03em;color:var(--muted);text-transform:none;}
.enc-sous-titre:first-child{padding-top:0 !important;}
.enc-imp .t{min-width:0;overflow:hidden;}
.enc-imprimer{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--card);border-radius:6px;padding:2px 6px;cursor:pointer;color:var(--muted);}
.enc-imprimer:hover,.enc-imprimer:focus-visible{border-color:var(--accent);color:var(--accent);}
/* Les devoirs datés (N°265) : la date à droite ; proposée = discrète, ✓ pour confirmer. */
.enc-due{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);white-space:nowrap;margin-top:2px;}
.enc-due input[type=date]{font:inherit;font-size:12px;border:1px solid transparent;border-radius:4px;background:transparent;padding:0 2px;color:var(--ink);}
.enc-due input[type=date]:hover,.enc-due input[type=date]:focus{border-color:var(--accent-bord);background:var(--card);}
.enc-due.a-confirmer input[type=date]{width:22px;color:transparent;}
.enc-due.a-confirmer input[type=date]:focus{width:auto;color:inherit;}
.enc-confirmer{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:0 6px;cursor:pointer;color:var(--accent);font-size:12px;}
.enc-recu ul{margin:2px 0 6px 16px;padding:0;}
.enc-donne{color:var(--muted);font-size:12px;}
/* « élèves » / « prof » (N°266) : l'étiquette « élèves » seule se voit ; « + élèves » au survol. */
.eleves-marque{border:1px solid transparent;background:none;border-radius:8px;font:inherit;font-size:11px;line-height:16px;padding:0 6px;cursor:pointer;color:var(--muted);visibility:hidden;white-space:nowrap;}
.eleves-marque.on{visibility:visible;color:var(--accent);background:var(--accent-pale);border-color:var(--accent-bord);}
li:hover > .eleves-marque,.ec-doc:hover .eleves-marque,.eleves-marque:focus-visible{visibility:visible;}
.eleves-marque:not(.on):hover{border-color:var(--line);color:var(--accent);}
.enc-cadre-impression{position:fixed;right:0;bottom:0;width:1px;height:1px;border:0;opacity:0;pointer-events:none;}
/* Le nombre, en texte simple (Boris, 10/10 : la surbrillance jaune était inutile). */
.enc-ex{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;margin-top:1px;}
.enc-tache-reglage{flex-basis:100%;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:4px 0 2px 26px;font-size:12px;}
.enc-tache-reglage select{max-width:260px;font-size:12px;}
.enc-tache-reglage input{width:56px;font-size:12px;}
.enc-tache-reglage .enc-vide{color:var(--muted);}
.enc-ajout{width:100%;font:inherit;font-size:13px;border:0;border-bottom:1px dashed var(--accent-bord);background:transparent;padding:3px 0;margin-top:4px;}
.enc-ajout:focus{outline:none;border-bottom-color:var(--accent);}
.enc-recu{font-size:13px;background:var(--fond-doux);border-radius:6px;padding:3px 8px;margin-bottom:5px;}
.enc-recu b{display:block;font-size:11px;font-weight:600;color:var(--muted);}
.enc-routines{display:flex;gap:12px;flex-wrap:wrap;padding-top:5px;margin-top:4px;border-top:1px solid var(--line);font-size:12px;}
.enc-routine{display:inline-flex;align-items:center;gap:4px;color:var(--muted);cursor:pointer;}
.enc-avant{font-size:13px;white-space:pre-line;color:var(--ink-2);}
.enc-avant-d{display:block;color:var(--muted);font-size:12px;margin-bottom:2px;}

/* ---------- En-tête d'une progression (Boris, 03/10/2026) ----------
   « PROGRESSION › [nom ▾] » à gauche, [année] [⚙] à droite : ni fil d'Ariane, ni
   barre d'onglets (progressions/_entete.html). */
.entete-prog{display:flex;align-items:center;gap:8px;padding:5px 0;}
.entete-racine{color:var(--bandeau-muted);text-decoration:none;font-size:12px;letter-spacing:.08em;text-transform:uppercase;}
.entete-racine:hover{color:var(--blanc);}
.entete-sep{color:var(--bandeau-muted);opacity:.7;font-weight:400;}
.entete-menu{position:relative;}
.entete-menu > summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border-radius:7px;}
.entete-menu > summary::-webkit-details-marker{display:none;}
.entete-choix > summary{white-space:nowrap;padding:3px 8px;margin-left:-8px;color:var(--bandeau-txt);font-size:15px;font-weight:700;}
.entete-choix > summary:hover,.entete-choix[open] > summary{background:var(--sur-sombre-2);}
.entete-chevron{font-size:11px;color:var(--bandeau-muted);}
.entete-actions{display:flex;align-items:center;gap:10px;}
.entete-reglages > summary{padding:5px;color:var(--bandeau-muted);}
.entete-reglages > summary:hover,.entete-reglages[open] > summary,.entete-reglages > summary.on{color:var(--blanc);background:var(--sur-sombre-2);}
.entete-menu > summary:focus-visible{outline:2px solid var(--blanc);outline-offset:2px;}
.entete-pop{position:absolute;top:calc(100% + 6px);left:0;z-index:60;min-width:240px;max-height:70vh;overflow:auto;
  background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px color-mix(in srgb, var(--nuit) 18%, transparent);padding:6px;
  font-size:14px;font-weight:500;}
.entete-pop-droite{left:auto;right:0;min-width:180px;}
/* Un `button` d'action (pas un lien) prend la même ligne de menu (les résultats d'une évaluation, N°321). */
.entete-pop button[role="menuitem"]{width:100%;border:0;background:none;font:inherit;text-align:left;cursor:pointer;}
.entete-pop a,.entete-pop button[role="menuitem"]{display:block;padding:6px 10px;border-radius:6px;color:var(--ink);text-decoration:none;white-space:nowrap;}
.entete-pop a:hover,.entete-pop a:focus-visible,.entete-pop button[role="menuitem"]:hover,.entete-pop button[role="menuitem"]:focus-visible{background:var(--accent-pale);}
.entete-pop a.on{color:var(--accent);font-weight:700;}
/* Le menu « changer de progression » : une ligne par niveau (Boris, 03/10/2026). */
.entete-niveaux{padding:8px 12px 10px;min-width:0;width:max-content;max-width:calc(100vw - 120px);}
.mn-etage{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:8px 0 3px;}
.mn-etage:first-child{padding-top:2px;}
.mn-ligne{display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:2px 0;}
.mn-niv{flex:0 0 38px;font-size:12px;font-weight:700;color:var(--muted);}
.entete-pop a.mn-choix{display:inline-block;padding:3px 10px;border:1px solid var(--line);border-radius:999px;font-size:13px;
  font-weight:500;color:var(--ink);white-space:nowrap;}
.entete-pop a.mn-choix:hover,.entete-pop a.mn-choix:focus-visible{border-color:var(--accent);color:var(--accent);background:var(--accent-pale);}
.entete-pop a.mn-choix.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);font-weight:600;}
/* Le tableau s'ancre au début du titre (et non sous le nom, plus à droite) : il tient dans la fenêtre. */
.entete-prog{position:relative;}
.entete-choix{position:static;}

/* Vue annuelle « bande en avant » (Boris, 03/10/2026) : la bande du trimestre de la
   séquence choisie reste seule (timeline.js l'anime vers le haut), l'encadré dessous. */
#timeline .bande.bande-masquee{display:none;}
/* Bande en avant d'une séquence à cheval sur deux trimestres : à côté, un petit
   tableau À PART montre la fin du trimestre d'avant ou le début du suivant (Boris,
   03/10/2026 — fusionner les deux tableaux n'était « pas clair »). */
#timeline .bande-fragments{gap:14px;}
#timeline .bande-morceau{display:flex;align-items:stretch;}
/* 3e temps de l'ouverture : l'encadré apparaît une fois la bande montée (160 ms, ease-out). */
.encadre-seances:not([hidden]){animation:enc-entre .16s cubic-bezier(0,0,.2,1);}
@keyframes enc-entre{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){.encadre-seances:not([hidden]){animation:none;}}

/* Volet des réglages d'une progression (Boris, 03/10/2026) : Configuration · Programme ·
   Export s'ouvrent à droite sur les 3/4 de la page (entete.js) ; 250 ms ease-out à
   l'entrée, 180 ms ease-in à la sortie (référentiel UI/UX G1-G3). */
.volet-reglages{position:fixed;inset:0 0 0 auto;margin:0;width:75vw;max-width:none;height:100vh;max-height:none;
  padding:0;border:0;border-left:1px solid var(--line);background:var(--bg);box-shadow:-12px 0 32px color-mix(in srgb, var(--nuit) 18%, transparent);
  display:flex;flex-direction:column;}
.volet-reglages:not([open]){display:none;}
.volet-reglages::backdrop{background:var(--voile);}
.volet-reglages[open]{animation:vr-entre .25s cubic-bezier(0,0,.2,1);}
.volet-reglages.ferme{animation:vr-sort .18s cubic-bezier(.4,0,1,1) forwards;}
@keyframes vr-entre{from{transform:translateX(100%);}to{transform:none;}}
@keyframes vr-sort{from{transform:none;}to{transform:translateX(100%);}}
@media (prefers-reduced-motion: reduce){.volet-reglages[open],.volet-reglages.ferme{animation:none;}}
.vr-tete{display:flex;align-items:center;gap:12px;padding:10px 18px;background:var(--bandeau);color:var(--bandeau-txt);}
.vr-tete h2{margin:0;font-size:15px;font-weight:700;flex:1;}
.vr-fermer{border:0;background:none;color:var(--bandeau-muted);font-size:22px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:6px;}
.vr-fermer:hover,.vr-fermer:focus-visible{color:var(--blanc);background:var(--sur-sombre-2);}
.vr-cadre{flex:1;width:100%;border:0;background:var(--bg);}
/* Le volet d'un document (volet_document.js, N°263) : « ouvrir à côté » dans le bandeau ; sans
   la bordure claire, qui ressortait en trait blanc contre le lecteur PDF sombre (Boris, 10/10). */
.volet-document{border-left:0;}
.vr-onglet{color:var(--bandeau-muted);font-size:13px;text-decoration:none;padding:2px 8px;border-radius:6px;}
.vr-onglet:hover,.vr-onglet:focus-visible{color:var(--blanc);background:var(--sur-sombre-2);}
/* La page DANS le volet : ni barre latérale, ni bande titre. */
.dans-volet .sidebar,.dans-volet .topbar{display:none;}

/* Pastille du type d'une étape (étape 4) : grise sans type, pleine pour DS / TP (frise),
   claire pour un type compté. */
.enc-type{font:inherit;font-size:11px;border-radius:10px;padding:0 7px;border:1px solid var(--line-fort);background:var(--fond-doux);
  color:var(--muted);cursor:pointer;white-space:nowrap;flex:none;line-height:18px;}
.enc-type.compte{background:var(--accent-pale);border-color:var(--accent-bord);color:var(--accent);}
.enc-type.frise{background:var(--accent);border-color:var(--accent);color:var(--blanc);}
.enc-type.t-ds{background:var(--danger);border-color:var(--danger);}
.enc-type.t-tp{background:var(--ok);border-color:var(--ok);}
.enc-menu-titre{font-size:11px;font-weight:700;color:var(--muted);padding:6px 10px 2px;text-transform:uppercase;letter-spacing:.03em;}

/* Séance hors séquence (étape 4, P3 b) : bloc gris à son titre, case sans numéro en pointillé ;
   le « + » d'une heure libre ; au survol, les séquences qu'elle évalue s'allument. */
.cal-grid .bloc-hors{position:absolute;top:4px;height:30px;box-sizing:border-box;border-radius:4px;background:var(--muted);color:var(--blanc);
  font-size:11px;font-weight:600;padding:2px 4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;
  box-shadow:0 1px 2px var(--ombre-2);z-index:1;}
.cal-grid .seance-case.hors{border:1.5px dashed var(--muted);}
.cal-grid .seance-case.groupes{background:var(--accent-pale);color:var(--accent);white-space:nowrap;font-size:8px;letter-spacing:-.2px;padding:0 1px;}
.cal-grid .seance-case.groupes.sel{background:var(--accent);color:var(--blanc);}
.cal-grid .seance-case.alterne-manque{top:53px;border-style:dashed;color:var(--danger);background:var(--card);}
.cal-grid .piste.piste-p2:has(.alterne-manque){height:70px;}
.cal-grid .tl-plus-hors{position:absolute;top:37px;width:14px;height:14px;border-radius:50%;border:1px dashed var(--accent);
  background:var(--card);color:var(--accent);font:700 11px/12px system-ui,sans-serif;padding:0;cursor:pointer;z-index:5;}
.cal-grid .tl-plus-hors:hover{background:var(--accent);color:var(--blanc);border-style:solid;}
.cal-grid .bloc.allume{box-shadow:0 0 0 3px var(--alerte-bord);}
.cal-grid .bloc.eteint{opacity:.3;}
.enc-porte{display:flex;gap:6px;align-items:center;cursor:pointer;}

/* N°245 — « n'a pas eu lieu » : la date d'un créneau se clique ; un jour aux heures
   PERDUES (absence, sortie, autre) se hachure comme un férié, sa date en gris (Boris,
   06/10 : plus de rouge ; l'infobulle dit « heures perdues ») ; la séance restée à sa place
   est « à replacer » (pointillé rouge, au-dessus de la hachure pour se glisser). */
.cal-grid .hcell.jour-clic{cursor:pointer;}
.cal-grid .hcell.jour-clic:hover{background:var(--accent-pale);color:var(--accent);}
.cal-grid .hcell.jour-marque{background:var(--weekB);color:var(--muted);font-weight:700;}
.cal-grid .seance-case.areplacer{border-style:dashed;color:var(--danger);background:var(--fond-doux);z-index:4;}
.tl-menu-jour-note{font-size:11px;color:var(--muted);padding:6px 10px;border-top:1px solid var(--line);}
.dlg-avert{background:var(--alerte-fond);border:1px solid var(--alerte-bord);border-radius:6px;padding:8px 10px;color:var(--alerte-texte);margin:0;}
.dlg-choix-liste{display:grid;gap:8px;margin-top:12px;}
.dlg-choix{font:inherit;text-align:left;border:1px solid var(--line-fort);background:var(--card);border-radius:8px;padding:8px 10px;cursor:pointer;}
.dlg-choix:hover{border-color:var(--accent);background:var(--fond-doux);}
.dlg-choix b{display:block;font-size:13px;}
.dlg-choix span{font-size:12px;color:var(--muted);}

/* ---------- Cette semaine (cadrage_cette_semaine.md, 06/10/2026) ----------
   La page tient sur un écran : le contenu prend la hauteur restante et la grille
   la partage entre les PÉRIODES (minmax(48px,1fr)) — jamais de hauteur en minutes. */
.page-semaine .main{height:100vh;}
.sem-contenu{display:flex;flex-direction:column;min-height:0;padding:10px 18px 14px;}
.sem-ab{display:inline-block;margin-left:8px;font-size:12.5px;font-weight:700;border-radius:999px;
  padding:1px 10px;vertical-align:1px;color:var(--sb-bg);}
.sem-ab-a{background:var(--weekA);} .sem-ab-b{background:var(--accent-bord);}
.sem-actions{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.sem-dates{color:var(--muted);font-size:13px;margin-left:6px;}
.sem-vide{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px;color:var(--muted);}
.sem-grille{flex:1;min-height:0;display:grid;grid-template-columns:58px repeat(5,minmax(0,1fr));gap:6px;}
.sem-jour{background:var(--sb-bg);color:var(--blanc);border-radius:6px;text-align:center;font-size:12.5px;
  font-weight:700;text-transform:uppercase;letter-spacing:.02em;padding:4px 0;line-height:1.25;}
.sem-jour small{display:block;font-weight:500;text-transform:none;opacity:.8;}
.sem-jour.auj{background:var(--accent);box-shadow:0 0 0 3px var(--accent-bord);}
.sem-jour.ferme{background:var(--muted);}
.sem-p{grid-column:1;color:var(--muted);font-size:12px;font-weight:700;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-end;padding-right:6px;}
.sem-p small{font-weight:400;font-size:10.5px;}
.sem-libre{border:1px dashed var(--line);border-radius:7px;}
.sem-ferme{border-radius:7px;background:repeating-linear-gradient(135deg,var(--fond-gris) 0 8px,var(--fond-doux) 8px 16px);
  display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:600;text-align:center;padding:8px;}
.sem-carte{--cc:var(--muted);position:relative;min-height:0;overflow:hidden;background:var(--card);border:1px solid var(--line);
  border-left:5px solid var(--cc);border-radius:7px;padding:6px 9px;display:flex;flex-direction:column;
  justify-content:center;gap:2px;color:var(--ink);text-decoration:none;}
a.sem-carte:hover{box-shadow:0 2px 8px color-mix(in srgb, var(--nuit) 15%, transparent);}
.sem-carte.saute{background:repeating-linear-gradient(135deg,var(--fond-gris) 0 8px,var(--fond-doux) 8px 16px);}
.sem-carte.saute .sem-ti{color:var(--muted);font-weight:600;}
.sem-chips{display:flex;gap:5px;align-items:center;flex-wrap:wrap;}
.sem-cl{background:var(--cc);color:var(--blanc);font-weight:700;font-size:12px;border-radius:5px;padding:0 7px;}
.sem-ti{font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sem-rien{color:var(--muted);font-style:italic;}
.sem-li{font-size:11.5px;color:var(--muted);}
.fam-pc{--cc:var(--cat-violet);} .fam-tk{--cc:var(--cat-ambre);} .fam-ib{--cc:var(--cat-bleu);} .fam-cs{--cc:var(--cat-rose);} .fam-aes{--cc:var(--cat-vert);}
/* Incr. 2 : les séances sur les cartes (maquette M3-M6). */
.sem-meta{color:var(--bandeau-muted);font-size:13px;white-space:nowrap;}
.sem-meta b{color:var(--blanc);}
.sem-etats{margin-left:auto;display:flex;gap:4px;}
.sem-sq{border:1px solid var(--line-fort);font-weight:600;font-size:11.5px;border-radius:5px;padding:0 6px;background:var(--card);}
.sem-etat{font-size:11px;font-weight:700;border-radius:999px;padding:0 7px;white-space:nowrap;}
.sem-etat.ok{color:var(--ok);background:var(--ok-fond);}
.sem-etat.af{color:var(--alerte);background:var(--alerte-fond);}
.sem-etat.moment{color:var(--blanc);background:var(--accent);}
.sem-carte.prete{background:var(--ok-fond);border-color:var(--ok-bord);border-left-color:var(--cc);}
.sem-carte.passe{opacity:.5;}
.sem-carte.passe:hover{opacity:.85;}
.sem-carte.encours{box-shadow:0 0 0 2px var(--accent);}
/* Calendrier › Emploi du temps (28/10/2026, maquette editeur_emploi_du_temps) : la grille de
   « Cette semaine », chaque case cliquable. Les cases sont des <button> : on efface leur style
   natif pour garder celui des cartes. */
/* A et B sur la même grille (Boris, 30/10/2026, « comme le mini-site ») : un jour = deux moitiés ; l'en-tête
   du jour les nomme en bas à gauche (A) et à droite (B) ; une moitié vide garde sa lettre, pâle. */
.ed-grille .sem-jour{position:relative;}
.ed-ab{position:absolute;inset:auto 0 2px;display:flex;justify-content:space-between;padding:0 8px;
  font-size:10px;font-weight:600;opacity:.7;line-height:1;}
/* Dans une moitié, la lettre passe au coin (comme le mini-site) : le nom du cours garde la largeur. */
.ed-grille .ed-moitie .sem-sq{position:absolute;top:3px;right:3px;padding:0 4px;font-size:10px;line-height:1.4;}
.ed-grille .sem-carte.ed-moitie{padding-right:6px;}
.ed-grille .sem-libre.ed-moitie{position:relative;}
.ed-grille .sem-libre.ed-moitie .sem-sq{color:var(--muted);background:none;border-color:var(--line);opacity:.8;}
.ed-grille .sem-carte,.ed-grille .sem-libre,.ed-grille .sem-p{font:inherit;cursor:pointer;text-align:left;}
.ed-grille .sem-libre{background:none;display:flex;align-items:center;justify-content:center;
  color:transparent;font-size:18px;}
.ed-grille .sem-libre:hover,.ed-grille .sem-libre:focus-visible{color:var(--muted);border-color:var(--line-fort);}
.ed-grille .sem-carte:hover{box-shadow:0 2px 8px color-mix(in srgb, var(--nuit) 15%, transparent);}
.ed-grille .sem-p{background:none;border:none;border-radius:6px;text-align:right;}
.ed-grille .sem-p:hover{background:var(--fond-gris);}
.dlg-cours,.dlg-horaire,.dlg-evt{max-width:480px;}
/* Cette année, modifiable (28/10/2026) : la fenêtre d'un événement, et ce qui s'ouvre d'un clic. */
.ev-classes{display:flex;flex-wrap:wrap;gap:4px 12px;}
.ev-classe{display:inline-flex;align-items:center;gap:4px;margin:0;font-weight:400;}
.ev-perte{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ev-de{display:inline-flex;align-items:center;gap:6px;}
.ev-de[hidden]{display:none;}
.page-annee .an-ev,.page-annee .an-lib-ferme{cursor:pointer;}
.an-sans-date{font:inherit;font-size:12px;background:var(--card);border:1px solid var(--line);
  border-radius:6px;padding:1px 8px;margin-left:6px;cursor:pointer;color:var(--ink);}
.an-sans-date:hover{border-color:var(--line-fort);}
.ec-avert{margin:10px 0 0;font-size:12.5px;color:var(--alerte-texte);background:var(--alerte-fond);
  border:1px solid var(--alerte-bord);border-radius:8px;padding:6px 10px;}
.sem-carte.prochain{box-shadow:0 0 0 2px var(--accent),0 4px 12px color-mix(in srgb, var(--accent) 25%, transparent);}
.sem-prochain{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:13px;background:var(--card);
  border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:6px;padding:4px 10px;
  color:var(--ink);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
a.sem-prochain[href]:hover{border-color:var(--accent);}
.sem-prochain .q{color:var(--muted);}
.sem-prochain .ok{color:var(--ok);font-weight:600;} .sem-prochain .af{color:var(--alerte);font-weight:600;}
/* Une carte d'UNE période doit tenir : étiquettes sur une seule ligne (la classe
   cède d'abord), lieu sur une ligne, et un contenu trop haut se coupe en BAS
   (`safe center`), jamais en haut — c'est là que sont la classe et l'état. */
.sem-carte{justify-content:safe center;}
.sem-chips{flex-wrap:nowrap;min-width:0;}
.sem-cl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;}
.sem-sq,.sem-etats{flex:0 0 auto;}
.sem-sq{max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sem-li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sem-carte.une-periode .sem-ti{-webkit-line-clamp:1;}
/* « ▶ En classe » (06/10/2026) : posé dans le coin bas-droit de la carte (même case de
   la grille), au-dessus d'elle ; la carte garde son propre clic. */
.sem-en-classe{align-self:end;justify-self:end;z-index:1;margin:0 5px 5px 0;width:26px;height:22px;
  display:flex;align-items:center;justify-content:center;border-radius:6px;background:var(--accent);
  color:var(--blanc);font-size:11px;text-decoration:none;box-shadow:0 1px 3px color-mix(in srgb, var(--nuit) 25%, transparent);}
.sem-en-classe:hover{background:var(--accent-dark);}
.sem-en-classe:focus-visible{outline:3px solid var(--accent-bord);outline-offset:1px;}

/* ---------- En classe (cadrage_seance_en_classe.md, 06/10/2026) ----------
   Maquette v3 du 28/09 : trois colonnes, TOUT SUR UNE PAGE (F16) — le contenu prend la
   hauteur restante, les listes longues défilent dans leur cadre. */
.page-en-classe .main{height:100vh;display:flex;flex-direction:column;}
.ec-contenu{flex:1;display:flex;flex-direction:column;min-height:0;padding:10px 18px 14px;}
#ec-titre{display:inline-flex;align-items:center;gap:10px;min-width:0;}
.ec-pastille{background:var(--cc,var(--muted));color:var(--blanc);border-radius:999px;padding:2px 12px;font-size:14px;font-weight:700;white-space:nowrap;}
.ec-fil{display:flex;flex-direction:column;line-height:1.2;min-width:0;}
.ec-seq{font-size:12.5px;font-weight:500;color:var(--bandeau-muted);}
.ec-seance{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ec-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.ec-horaire{color:var(--bandeau-muted);font-size:13px;white-space:nowrap;}
.ec-reste{font-weight:700;color:var(--blanc);font-variant-numeric:tabular-nums;}
.ec-reste.bientot{color:var(--alerte-bord);}
.ec-case{display:inline-flex;align-items:center;gap:6px;background:var(--card);color:var(--ink);border-radius:999px;padding:3px 12px;font-size:13px;white-space:nowrap;cursor:pointer;}
.ec-case input{width:17px;height:17px;margin:0;}
.ec-onglets{display:flex;gap:6px;margin-bottom:8px;}
.ec-onglets button{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--card);border-radius:6px;padding:4px 12px;cursor:pointer;}
.ec-onglets button.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);}
.ec-vide{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:16px;color:var(--muted);display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.ec-grille{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,.95fr);gap:12px;}
.ec-colonne{display:flex;flex-direction:column;gap:12px;min-height:0;}
.ec-carte{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 14px;display:flex;flex-direction:column;min-height:0;}
.ec-principale{border:2px solid var(--accent);}
.ec-extensible{flex:1;}
.ec-carte h2{font-size:15px;margin:0 0 6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ec-pousse{flex:1;}
.ec-defile{overflow:auto;min-height:0;flex:1;}
.ec-discret{color:var(--muted);font-size:12.5px;font-weight:400;margin:0;}
.btn.actif{outline:3px solid var(--accent-bord);}
.ec-etapes{list-style:none;margin:0;padding:0;}
.ec-etapes li{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:start;padding:7px 2px;border-top:1px solid var(--line-doux);font-size:15px;line-height:1.35;}
.ec-etapes li:first-child{border-top:0;}
/* La case « fait » seulement : sur `input` tout court, la règle écrasait aussi le champ
   du ✏️ à 20 × 20 px (Boris, 09/10 : « bug d'affichage »). */
.ec-etapes input[type="checkbox"]{width:20px;height:20px;margin:0;cursor:pointer;}
.ec-etapes li.faite .t{color:var(--ok);}
.ec-bilan{margin-top:6px;font-size:13px;color:var(--muted);display:flex;gap:10px;align-items:center;}
.ec-bilan b{color:var(--ink);}
.ec-etat{margin-left:auto;font-size:12px;}
.ec-etat.ko{color:var(--danger);font-weight:600;}
.ec-carte ul{margin:0;padding-left:18px;}
.ec-cahier{white-space:pre-line;font-size:13.5px;margin-top:4px;}
/* 22/10/2026 (Boris : « harmonise ») : tous les cadres à 13,5 px comme le Déroulé ; une
   consigne longue défile dans son cadre au lieu de passer sous le cadre suivant. */
.ec-carte{font-size:13.5px;line-height:1.4;}
.ec-consigne{white-space:pre-line;font-size:13.5px;background:var(--fond-doux);border-radius:6px;padding:6px 9px;min-height:4.4em;overflow:auto;flex:0 1 auto;}
#ec-recus .ec-resume{flex:0 1 auto;min-height:1.6em;}
.ec-consigne > div + div{margin-top:4px;padding-top:4px;border-top:1px dashed var(--line);}
#ec-devoirs textarea,#ec-notes textarea{width:100%;font:inherit;border:1px solid var(--line-fort);border-radius:6px;padding:6px 8px;height:64px;resize:none;}
.ec-projete{font-size:13px;} .ec-projete b{color:var(--accent);}
.ec-rangee{display:flex;gap:4px;flex-wrap:wrap;align-items:center;margin:6px 0 2px;}
#ec-minuteur .ec-rangee{justify-content:center;}
.ec-cadran{font-size:34px;font-weight:700;font-variant-numeric:tabular-nums;text-align:center;line-height:1.1;}
.ec-cadran.fini{color:var(--danger-texte);font-size:22px;}
.ec-segments{display:inline-flex;border:1px solid var(--line-fort);border-radius:6px;overflow:hidden;}
.ec-segments button{font:inherit;font-size:12.5px;border:0;background:var(--card);padding:3px 9px;cursor:pointer;}
.ec-segments button.on{background:var(--accent);color:var(--blanc);}
/* Incr. 2 : l'appel ManageBac. */
.ec-appel-mb{display:inline-flex;gap:2px;}
.ec-icone{padding-left:7px;padding-right:7px;}
.ec-dialogue{border:0;border-radius:12px;padding:16px 18px;width:min(560px,94vw);box-shadow:0 8px 24px var(--ombre-2);}
.ec-dialogue::backdrop{background:var(--voile);}
.ec-dialogue h2{font-size:16px;margin:0 0 6px;}
.ec-dialogue input{width:100%;font:inherit;padding:6px 9px;border:1px solid var(--line-fort);border-radius:6px;margin-top:8px;}
.ec-erreur{color:var(--danger);font-size:12.5px;min-height:1.2em;margin:4px 0 0;}
.ec-fin{justify-content:flex-end;}
.ec-vers{font-size:12.5px;white-space:nowrap;}
.ec-etat:empty{display:none;}
.ec-bilan .ec-vers{margin-left:auto;}
.ec-bilan .ec-etat{margin-left:auto;}
.ec-bilan .ec-etat:not(:empty) + .ec-vers{margin-left:10px;}
/* Incr. 3 : le réel ≠ le prévu, dans le Déroulé. */
.ec-etapes li{grid-template-columns:20px minmax(0,1fr) auto;gap:4px 8px;padding:5px 2px;font-size:13.5px;}
.ec-etapes input[type="checkbox"]{width:17px;height:17px;margin-top:1px;}
.ec-actions-etape{display:flex;gap:2px;align-items:center;}
.ec-icone-btn{font:inherit;font-size:11.5px;min-width:22px;min-height:22px;border:1px solid var(--line-fort);background:var(--card);border-radius:6px;cursor:pointer;padding:0 5px;}
.ec-icone-btn:hover{border-color:var(--accent);}
.ec-icone-btn:disabled{opacity:.35;cursor:default;}
.ec-marque{font-size:11px;border-radius:999px;padding:1px 7px;margin-left:6px;font-weight:600;vertical-align:1px;}
.ec-marque.ajoutee{background:var(--ok-fond);color:var(--ok);}
.ec-marque.modifiee{background:var(--alerte-fond);color:var(--alerte-texte);}
.ec-prevu{display:block;font-size:12px;color:var(--muted);text-decoration:line-through;}
.ec-edition{width:100%;font:inherit;padding:3px 6px;border:2px solid var(--accent);border-radius:6px;}
.ec-ajout{display:flex;gap:8px;margin-top:8px;}
/* Les devoirs donnés en classe (N°265) : une ligne par devoir, sa date, × au survol. */
.ec-devoirs-liste{list-style:none;margin:0;padding:0;}
.ec-devoirs-liste li{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;padding:3px 0;border-bottom:1px dashed var(--line-doux);}
.ec-x{border:0;background:none;color:var(--muted);cursor:pointer;margin-left:auto;visibility:hidden;font-size:15px;}
.ec-devoirs-liste li:hover .ec-x,.ec-x:focus-visible{visibility:visible;}
.ec-ajout input{flex:1;font:inherit;padding:5px 10px;border:1px solid var(--line-fort);border-radius:6px;}
/* L'encadré montre le réel écrit en classe (06/10/2026) ; le titre reste le prévu. */
.enc-reel{display:block;font-size:11.5px;color:var(--alerte-texte);}
.enc-en-classe{font-size:10.5px;font-weight:600;border-radius:999px;padding:0 6px;background:var(--ok-fond);color:var(--ok);white-space:nowrap;}
/* Incr. 4 : tirage, groupes, « Qui les a faits ? », élèves de la classe. */
.ec-centre{justify-content:center;text-align:center;}
.ec-tire{font-size:22px;font-weight:700;text-align:center;min-height:30px;}
.ec-groupes{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:4px;margin-top:6px;font-size:12px;}
.ec-groupes div{background:var(--fond-doux);border-radius:6px;padding:4px 6px;}
.ec-groupes b{display:block;font-size:11px;color:var(--muted);}
#ec-tirage select,#ec-tirage input[type=number]{width:auto;font:inherit;font-size:12.5px;padding:2px 4px;border:1px solid var(--line-fort);border-radius:6px;}
#ec-tirage input[type=number]{width:52px;}
.ec-resume{font-size:12.5px;margin-top:4px;}
.ec-resume div{padding:2px 0;}
.ec-etiquette{font-size:11px;border-radius:999px;padding:1px 7px;font-weight:600;background:var(--alerte-fond);color:var(--alerte-texte);}
.ec-etiquette.partie{background:var(--alerte-fond);}
.ec-dialogue-large{width:min(900px,94vw);max-height:88vh;padding:0;}
.ec-tete-dialogue{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--card);z-index:1;}
.ec-tete-dialogue h2{flex:1;margin:0;font-size:15px;}
.ec-lignes-eleves{display:grid;grid-template-columns:1fr 1fr;gap:2px 20px;padding:10px 16px 14px;}
.ec-ligne-eleve{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,.8fr);gap:6px;align-items:center;font-size:12.5px;padding:3px 4px;border-bottom:1px solid var(--line-doux);}
.ec-ligne-eleve b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;}
.ec-ligne-eleve.non{background:var(--alerte-fond);} .ec-ligne-eleve.partie{background:var(--alerte-fond);}
.ec-ligne-eleve input{font:inherit;font-size:12px;padding:2px 6px;border:1px solid var(--line-fort);border-radius:6px;min-width:0;}
.ec-ligne-eleve input:disabled{background:var(--fond-doux);border-color:var(--line-doux);}
.ec-vivier{border:1px solid var(--line);border-radius:8px;margin:10px 16px;padding:6px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px 12px;font-size:13px;}
.ec-vivier legend{font-size:12px;font-weight:700;color:var(--muted);padding:0 4px;}
.ec-vivier label{display:flex;gap:6px;align-items:center;cursor:pointer;}
/* Incr. 5 : les documents d'une étape, le volet, la fenêtre d'attache. */
/* 21/10/2026 (Boris : « revois le cadre ») : les documents prennent toute la largeur de
   l'étape, sous le titre ET les boutons, une ligne chacun ; un nom trop long se tronque. */
.ec-docs{grid-column:2 / -1;display:flex;flex-direction:column;gap:3px;margin-top:-1px;min-width:0;}
.ec-doc{font-size:12px;background:var(--accent-pale);border-radius:6px;padding:2px 3px 2px 7px;display:flex;gap:4px;align-items:center;min-width:0;}
.ec-doc-titre{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ec-doc .btn{padding:1px 7px;font-size:11.5px;line-height:1.4;}
.ec-doc a.btn{text-decoration:none;}
.ec-volet{position:fixed;top:0;right:0;height:100%;width:min(760px,56vw);background:var(--card);box-shadow:0 8px 24px var(--ombre-3);
  transform:translateX(100%);transition:transform 180ms ease-out;z-index:50;display:flex;flex-direction:column;visibility:hidden;}
.ec-volet.ouvert{transform:none;visibility:visible;}
.ec-volet-tete{display:flex;gap:8px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);}
.ec-volet-tete b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ec-volet iframe{flex:1;border:0;width:100%;}
@media (prefers-reduced-motion: reduce){.ec-volet{transition:none;}}
.ec-attache{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;padding:12px 16px;}
/* Trois sources (ADR-0017) : le dossier Enseignement à gauche sur deux rangs, l'ordinateur et le
   lien à droite ; sans dossier (site en ligne), l'ordinateur et le lien côte à côte. */
.ec-attache > #ec-section-fichier{grid-row:span 2;}
.ec-attache:has(> #ec-section-fichier[hidden]){grid-template-columns:1fr 1fr;}
.ec-depot{border:1.5px dashed var(--line-fort);border-radius:8px;padding:16px 12px;text-align:center;font-size:13px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:8px;}
.ec-depot.survol{border-color:var(--accent);background:var(--accent-pale);color:var(--ink);}
.ec-envois{list-style:none;margin:8px 0 0;padding:0;font-size:12.5px;}
.ec-envois li{display:flex;justify-content:space-between;gap:8px;padding:2px 0;border-bottom:1px solid var(--line-doux);}
.ec-envois li.ec-erreur{display:block;border:0;}
.ec-envois li > span:last-child{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.ec-envoyer{display:flex;justify-content:flex-end;}
.ec-envoyer .btn{margin-top:8px;}
.ec-place{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;flex-wrap:wrap;}
.ec-attache h3{font-size:13.5px;margin:0 0 6px;}
.ec-attache form{display:flex;flex-direction:column;gap:6px;}
.ec-attache input{font:inherit;padding:5px 9px;border:1px solid var(--line-fort);border-radius:6px;}
.ec-fil-dossiers{font-size:12.5px;margin-bottom:6px;}
.ec-lien{font:inherit;background:none;border:0;padding:1px 2px;color:var(--accent);cursor:pointer;text-align:left;}
.ec-lien:hover{text-decoration:underline;}
.ec-liste-fichiers{list-style:none;margin:0;padding:0;max-height:52vh;overflow:auto;font-size:13px;border:1px solid var(--line);border-radius:6px;}
.ec-liste-fichiers li{padding:2px 6px;border-bottom:1px solid var(--line-doux);}
#ec-dialogue-document .ec-erreur{padding:0 16px 10px;}
/* Audit UI/UX du 22/10/2026 (planification/audit_ui-ux_2026-10-22.md) : la page tient sur
   un écran de 1280 × 657 px. Colonne du milieu : 664 px demandés pour 512, « Devoirs pour
   aujourd'hui » réduit à son titre ; colonne de droite : 608 pour 512, Tirage coupé.
   Rien n'est retiré : marges resserrées, et chaque liste défile dans son cadre. */
.ec-grille,.ec-colonne{gap:8px;}
.ec-carte{padding:8px 12px;}
.ec-carte h2{margin-bottom:4px;}
.ec-rangee{margin:4px 0 2px;}
/* Les devoirs du jour passent avant la séance d'avant : ils prennent la place libre,
   la séance d'avant et la liste des devoirs à venir défilent si elles débordent. */
#ec-recus{flex:1 1 auto;min-height:150px;}
#ec-avant{flex:0 1 auto;max-height:24%;}
#ec-devoirs{flex:0 1 auto;}
#ec-devoirs .ec-devoirs-liste{overflow:auto;min-height:0;flex:0 1 auto;}
#ec-notes textarea{height:46px;}
#ec-ecran h2 .ec-discret{font-size:12px;}
#ec-minuteur .ec-rangee{gap:3px;}
#ec-minuteur [data-regler]{min-width:32px;padding-left:6px;padding-right:6px;}
.ec-cadran{font-size:30px;}
#ec-tirage .ec-tire:empty{min-height:0;}
/* I3 (WCAG 2.5.8) : les cibles font au moins 24 px de haut. */
.ec-icone-btn{min-width:24px;min-height:24px;}
.ec-doc .btn{min-height:24px;}
.ec-doc .eleves-marque{line-height:22px;}

/* ---------- Mes classes › DS (N°276, BRIEF-27) ---------- */
.classe-ds td{vertical-align:middle;}
.classe-ds-date{white-space:nowrap;font-weight:600;}
.classe-ds-cours{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);}
.classe-ds-etat{display:inline-block;font-size:12px;font-weight:600;border-radius:10px;padding:2px 9px;white-space:nowrap;}
.classe-ds-etat.etat-fini{background:var(--ok-fond);color:var(--ok-texte);}
.classe-ds-etat.etat-cours{background:var(--accent-pale);color:var(--accent);}
.classe-ds-etat.etat-grille{background:var(--alerte-fond);color:var(--alerte-texte);}
.classe-ds-etat.etat-rien{background:var(--fond-gris);color:var(--muted);}
.classe-ds-barre{display:inline-block;width:70px;height:8px;background:var(--fond-gris);border-radius:4px;vertical-align:middle;overflow:hidden;margin-right:6px;}
.classe-ds-barre i{display:block;height:100%;background:var(--accent);}
.classe-ds-revoir{display:inline-block;font-size:11px;font-weight:700;background:var(--signal);color:var(--ink);border-radius:8px;padding:1px 7px;margin-left:6px;}
.classe-ds-actions{text-align:right;white-space:nowrap;}
.classe-ds-copies{white-space:nowrap;}
/* Résultats pour les élèves (23/10) : 2e ligne des actions, et le volet large qui montre les
   fiches (une page A4 ≈ 800 px) dans un cadre, sur fond gris comme un aperçu d'impression. */
.classe-ds td:nth-child(3){min-width:170px;}   /* le titre de l'évaluation, pas sur 7 lignes */
.classe-ds-resultats{display:inline-block;text-align:left;}
.classe-ds-resultats > summary.btn{gap:4px;}
.classe-ds-resultats .entete-pop{min-width:140px;font-size:13px;}
.volet.volet-resultats{width:min(900px,96vw);}
.volet-resultats-cadre{flex:1;width:100%;border:0;background:var(--fond-gris);}

/* ---------- Corriger un DS (N°277, BRIEF-27) ---------- */
/* Niveaux : couleurs de l'école et de Pronote (décision de Boris du 18/10 — seule exception
   à « rouge = danger », conception-ui § 0) ; le niveau est toujours écrit en lettres. */
.nv{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:22px;border-radius:4px;
  font-size:12px;font-weight:700;padding:0 5px;}
.nv-MI{background:var(--niv-mi);color:var(--blanc);}.nv-DM{background:var(--niv-dm);color:var(--ink);}.nv-MF{background:var(--niv-mf);color:var(--ink);}
.nv-MS{background:var(--niv-ms);color:var(--ink);}.nv-TBM{background:var(--niv-tbm);color:var(--blanc);}
/* Maquette D (validée le 19/10) : une copie, un exercice à la fois, la page tient sur un écran —
   correction.js règle la hauteur de `.corr` sur la fenêtre. Échelle 4/8 px ; cibles ≥ 24 px. */
.corr{display:flex;flex-direction:column;gap:8px;min-height:0;}
.corr-tete{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.choix-eleve{position:relative;}
.choix-eleve summary{list-style:none;cursor:pointer;font-size:18px;font-weight:700;display:flex;gap:8px;align-items:center;
  padding:4px 8px;border-radius:8px;}
/* N°329 : le nom a une largeur FIXE, les pastilles qui suivent ne bougent plus d'une copie à l'autre */
.corr .choix-eleve summary{width:220px;justify-content:flex-start;}
/* Le nom se lit comme un SÉLECTEUR du thème « identité » (cadre de « 3e ▾ », N°320) ; le chevron
   tracé de la liste du site (N°324), en sarcelle, À GAUCHE du nom (Boris, 26/10) */
.corr .choix-eleve summary{border:1px solid var(--line);background:var(--card);padding:3px 10px;}
.corr .choix-eleve summary:hover,.corr .choix-eleve[open] summary{border-color:var(--accent);background:var(--card);}
.corr .choix-eleve .choix-chevron{flex:0 0 auto;color:var(--accent);transition:transform .15s;}
.corr .choix-eleve[open] .choix-chevron{transform:rotate(180deg);}
.corr .choix-nom{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* La liste des copies : une ligne par élève (Boris, 26/10) — elle s'élargit, « … » au-delà de 520 px */
.corr .choix-pop{max-width:520px;}
.corr .choix-pop a > span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.corr .choix-pop a > .sub{flex:0 0 auto;}
.choix-eleve summary::-webkit-details-marker{display:none;}
.choix-eleve summary:hover,.choix-eleve summary:focus-visible{background:var(--accent-pale);}
.choix-chevron{font-size:12px;color:var(--muted);}
.choix-pop{position:absolute;top:calc(100% + 4px);left:0;z-index:60;min-width:280px;max-height:70vh;overflow:auto;background:var(--card);
  border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px var(--ombre-2);padding:4px;}
.choix-pop a{display:flex;justify-content:space-between;gap:12px;padding:8px 12px;border-radius:4px;color:var(--ink);text-decoration:none;}
.choix-pop a:hover,.choix-pop a:focus-visible{background:var(--accent-pale);}
.choix-pop a.on{color:var(--accent);font-weight:700;}
.corr-pastilles{display:flex;gap:4px;}
.corr-pastilles a{position:relative;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;
  border:2px solid var(--line);background:var(--card);color:var(--ink);font-size:11px;font-weight:700;text-decoration:none;}
/* En cours = hachures vertes ; vert plein seulement à « Copie finie » (Boris, 21/10) */
.corr-pastilles a.encours{border-color:var(--niv-ms);background:repeating-linear-gradient(-45deg,var(--ok-bord) 0 3px,var(--card) 3px 6px);}
.corr-pastilles a.fait{background:var(--niv-ms);border-color:var(--niv-ms);color:var(--blanc);}
.corr-pastilles a.on{outline:3px solid var(--accent);outline-offset:1px;}
.corr-revoir{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;line-height:16px;text-align:center;font-size:11px;
  font-weight:700;background:var(--signal);color:var(--ink);border-radius:8px;}
.corr-finie{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;margin-left:auto;min-height:24px;}
.corr-finie input{width:20px;height:20px;}
/* Les exercices en ONGLETS accrochés au cadre (N°329) : l'onglet ouvert a le fond du cadre, sans bord bas */
.corr-exos{display:flex;gap:4px;align-items:flex-end;margin-bottom:-8px;position:relative;z-index:1;padding:0 8px;}
.corr-onglet-ex{flex:1;min-width:0;display:flex;gap:8px;align-items:center;min-height:40px;border:1px solid var(--line);
  border-bottom:0;background:var(--fond-gris);color:var(--muted);
  border-radius:8px 8px 0 0;padding:4px 12px;font:inherit;font-size:13px;cursor:pointer;text-align:left;}
.corr-onglet-ex:hover{background:var(--fond-doux);color:var(--ink);}
.corr-onglet-ex strong{white-space:nowrap;}
/* Sur UNE ligne (Boris, 26/10) : coupé par « … » s'il le faut, entier au survol et en tête de l'exercice */
.corr-onglet-titre{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.corr-onglet-n{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap;}
.corr-onglet-ex.on{background:var(--card);color:var(--ink);box-shadow:inset 0 3px 0 var(--accent);min-height:44px;}
/* Copie « Terminé » : fermée, grisée — décocher « Terminé » la rouvre (N°329) */
.corr-terminee .corr-corps{background:var(--fond-gris);}
.corr-terminee .corr-onglet-ex.on{background:var(--fond-gris);}
.corr-terminee .corr-exo{opacity:.6;filter:grayscale(1);}
.corr-terminee .corr-case{cursor:not-allowed;}
.corr-terminee .corr-case:hover{background:none;}
.corr-corps{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--card);border-radius:10px;
  box-shadow:0 1px 3px var(--ombre-1);padding:12px 16px;}
.corr-exo{flex:1;min-height:0;overflow:auto;}
.corr-exo h3{margin:0 0 4px;font-size:14px;}
.corr-colonnes{column-count:2;column-gap:32px;}
.corr-q{padding:4px 0;border-top:1px solid var(--line);}
/* Une question se coupe entre deux CASES, jamais dans une case : une grille d'exposé ou de TP n'a
   souvent qu'une question par critère, qui restait sinon dans une colonne (N°306) */
.corr-q-tete,.corr-case{break-inside:avoid;}
.corr-q-tete{break-after:avoid;}
.corr-q-tete{font-size:12.5px;margin-bottom:2px;}
.corr-k{font-size:11px;font-weight:700;color:var(--alerte-texte);background:var(--alerte-fond);border-radius:4px;padding:0 4px;margin-left:4px;}
.corr-case{display:flex;align-items:center;gap:8px;min-height:24px;padding:1px 8px;border-radius:4px;cursor:pointer;font-size:12.5px;}
.corr-case:hover{background:var(--fond-doux);}
.corr-case input{width:16px;height:16px;flex:0 0 16px;margin:0;pointer-events:none;}
.corr-case:has(input:checked){background:var(--ok-fond);}
.corr-case.kbd{outline:2px solid var(--accent);outline-offset:-1px;}
.corr-case-texte{flex:1;}
.corr-niv{font-size:11px;font-weight:700;border-radius:4px;padding:0 4px;}
/* Le numéro de la compétence : le même sur la case et dans le bandeau du bas (Boris, 21/10) */
.corr-comp-num{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:18px;height:18px;padding:0 4px;
  border-radius:9px;background:var(--fond-gris);color:var(--nuit);font-size:11px;font-weight:700;}
.corr-pts{flex:0 0 auto;font-size:11px;color:var(--muted);white-space:nowrap;}
/* Les fonds pâles des niveaux dérivent des couleurs Pronote (N°326) : MS et TBM restent distincts. */
.corr-niv-MS{background:color-mix(in srgb, var(--niv-ms) 16%, var(--card));color:var(--ok-texte);}
.corr-niv-TBM{background:color-mix(in srgb, var(--niv-tbm) 20%, var(--card));color:var(--ok-texte);}
.corr-res{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:8px;}
.corr-res-vide{grid-column:1/-1;margin:0;padding:8px 12px;background:var(--card);border:1px solid var(--line);border-radius:8px;}
.corr-res-comp{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;background:var(--card);border:1px solid var(--line);
  border-radius:8px;padding:4px 8px;font-size:12px;min-width:0;}
.corr-res-nom{flex:0 0 100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;}
.corr-res-comp select{font:inherit;font-size:12px;min-height:24px;border:1px solid var(--line);border-radius:4px;margin-left:auto;}
.corr-res-total{display:flex;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:4px 12px;
  font-size:13px;white-space:nowrap;}
.corr-erreur{grid-column:1/-1;color:var(--danger-texte);background:var(--danger-fond);border-radius:6px;padding:4px 8px;font-size:13px;margin:0;}
/* Évaluer en groupe, l'absent (N°306 — maquette `corriger_groupe.html`, validée le 22/10/2026) */
.corr-sous{font-size:12.5px;color:var(--muted);}
.choix-pop a.choix-lien{border-top:1px solid var(--line);color:var(--accent);font-size:13px;}
a.corr-sous{color:var(--muted);}
.corr-liens{margin-left:auto;display:flex;gap:6px;}
.corr-liens a{font-size:12.5px;padding:2px 10px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;background:var(--card);}
.corr-liens a:hover,.corr-liens a:focus-visible{border-color:var(--accent);color:var(--accent);}
.corr-absent + .corr-finie{margin-left:0;}
.corr-tete:has(.corr-pg){gap:10px;}
.corr-absent{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer;min-height:24px;margin-left:auto;}
.corr-absent input{width:18px;height:18px;}
.corr-pg{gap:6px;flex-wrap:wrap;}
.corr-pg-g{display:inline-flex;gap:3px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:2px 4px 2px 2px;background:var(--card);}
.corr-pg-g.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-bord);}
.corr-pastilles a.corr-pg-nom{width:auto;height:24px;border:0;border-radius:999px;padding:0 8px;background:var(--fond-gris);color:var(--nuit);}
.corr-pg-g.on a.corr-pg-nom{background:var(--accent);color:var(--blanc);}
.corr-pg-seuls{border-style:dashed;}
.corr-pastilles a.abs{background:var(--fond-gris);border-style:dashed;color:var(--discret);text-decoration:line-through;}
.corr-portee{flex:0 0 auto;font-size:10.5px;font-weight:700;border-radius:4px;padding:0 5px;background:var(--fond-gris);color:var(--nuit);}
.corr-ecart{flex:0 0 auto;font-size:10.5px;font-weight:700;border-radius:4px;padding:0 5px;background:var(--alerte-fond);color:var(--alerte-texte);border:1px solid var(--alerte-bord);}
.corr-rendre{flex:0 0 auto;font-size:11px;border:0;background:none;color:var(--accent);cursor:pointer;padding:0 2px;min-height:24px;}
.corr-case.corr-a-ecart{background:var(--alerte-fond);}
.corr-ecart[hidden],.corr-rendre[hidden],.corr-portee[hidden]{display:none;}
.corr-case-membres{cursor:default;padding-left:32px;}
.corr-membres{display:flex;gap:6px;flex:0 0 auto;}
.corr-membres label,.corr-membres-tete span{width:26px;justify-content:center;}
[data-vue-groupe] .corr-exo h3{display:flex;align-items:flex-end;}
.corr-membres-tete{margin-left:auto;padding-right:8px;font-size:10px;font-weight:700;color:var(--muted);}
.corr-membres-tete span{display:inline-flex;}
.corr-membres label{display:flex;align-items:center;cursor:pointer;}
.corr-membres input{width:16px;height:16px;margin:0;pointer-events:auto;}
.corr-membres label.abs{opacity:.45;cursor:not-allowed;}
.corr-absent-corps{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted);text-align:center;}
.corr-absent-corps strong{font-size:18px;color:var(--ink);}
.corr-res-groupe table{border-collapse:collapse;font-size:12px;background:var(--card);border:1px solid var(--line);border-radius:8px;width:100%;table-layout:fixed;}
.corr-res-groupe th:first-child{width:170px;}.corr-res-groupe th:last-child{width:80px;}
.corr-res-groupe th,.corr-res-groupe td{padding:2px 8px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap;}
.corr-res-groupe th{font-size:11px;color:var(--muted);font-weight:600;overflow:hidden;text-overflow:ellipsis;}
.corr-res-groupe td:first-child{overflow:hidden;text-overflow:ellipsis;}
.corr-res-groupe td:first-child,.corr-res-groupe th:first-child{text-align:left;}
.corr-res-groupe tr:last-child td{border-bottom:0;}
.gr{display:flex;flex-direction:column;gap:10px;}
.gr-barre{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px;}
.gr-barre select{font:inherit;font-size:13px;padding:3px 6px;border:1px solid var(--line);border-radius:6px;}
.gr-titre{font-size:15px;}
.gr-info{margin:0;background:var(--accent-pale);border:1px solid var(--accent-bord);border-radius:8px;padding:6px 12px;font-size:13px;}
.gr-cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;align-items:start;}
.gr-carte{background:var(--card);border-radius:10px;box-shadow:0 1px 3px var(--ombre-1);padding:8px 10px;}
.gr-carte.gr-seuls{background:var(--fond-doux);border:2px dashed var(--line);box-shadow:none;}
.gr-carte h3{margin:0 0 6px;font-size:13px;display:flex;gap:6px;align-items:center;}
.gr-carte h3 .sub{margin-left:auto;font-weight:400;}
.gr-suppr{border:0;background:none;color:var(--muted);font-size:16px;cursor:pointer;min-width:24px;min-height:24px;}
.gr-suppr:hover{color:var(--danger-texte);}
.gr-el{display:flex;align-items:center;gap:6px;font-size:13px;padding:3px 6px;border-radius:6px;background:var(--fond-doux);margin-bottom:4px;}
.gr-el select{margin-left:auto;width:auto;flex:0 0 auto;font-size:12px;padding:1px 4px;border:1px solid var(--line);border-radius:4px;min-height:24px;}
.gr-el.abs span{color:var(--discret);text-decoration:line-through;}
.po-cols{column-count:2;column-gap:28px;}
.po-q{break-inside:avoid;margin-bottom:6px;}
.po-q h4{margin:4px 0 2px;font-size:12.5px;}
.po-l{display:flex;align-items:center;gap:8px;font-size:12px;min-height:24px;border-top:1px solid var(--line);}
.po-t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.po-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;flex:0 0 auto;}
.po-seg button{border:0;background:var(--card);font:inherit;font-size:11px;padding:2px 9px;cursor:pointer;color:var(--muted);min-height:22px;}
.po-seg button.on{background:var(--accent);color:var(--blanc);font-weight:700;cursor:default;}
.po-seg button.on.g{background:var(--nuit);}
.po-tout{font-size:11px;border:0;background:none;color:var(--accent);cursor:pointer;}
/* N°277 b : une ligne de case s'ouvre au clic (modale « Modifier la case ») ; crayon au survol. */
.po-l.po-ed{cursor:pointer;}
.po-l.po-ed:hover,.po-l.po-ed:focus-visible{background:var(--fond-doux);}
.po-rep{flex:0 0 30px;font-size:11px;color:var(--muted);}
.po-pts{flex:0 0 auto;font-size:11px;color:var(--muted);}
.po-crayon{flex:0 0 auto;line-height:0;color:var(--muted);visibility:hidden;}
.po-l.po-ed:hover .po-crayon,.po-l.po-ed:focus-visible .po-crayon{visibility:visible;color:var(--accent);}
dialog.tl-dialog.dlg-case{max-width:520px;}
.dlg-case .dlg-case-grille{grid-template-columns:90px minmax(0,1fr);}
/* Un champ nombre garde sa largeur native (~150 px) : sans ceci, « Points » passe sous « Compétence ». */
.dlg-case .dlg-case-grille input,.dlg-case .dlg-case-grille select{width:100%;min-width:0;box-sizing:border-box;}
.dlg-case-niveau{display:flex;align-items:center;gap:10px;font-size:13px;margin-top:6px;}
.dlg-case-niveau .po-seg button{font-size:12px;padding:3px 12px;}
.dlg-case-info{margin:8px 0 0;}
.dlg-case-info.dlg-case-avis{color:var(--alerte-texte);background:var(--alerte-fond);border:1px solid var(--alerte-bord);border-radius:6px;padding:6px 8px;}
.dlg-case .btn-danger[disabled]{opacity:.45;cursor:not-allowed;}
/* La case « à revoir » dans Corriger (N°277 b) : ajoutée après le début de cette copie. */
.corr-case.corr-case-revoir{background:var(--alerte-fond);}
.corr-revoir-tag{flex:0 0 auto;font-size:10.5px;font-weight:700;border-radius:4px;padding:0 5px;background:var(--alerte-fond);color:var(--alerte-texte);border:1px solid var(--alerte-bord);}
.corr-onglet-ex .corr-pt-revoir{width:8px;height:8px;border-radius:50%;background:var(--alerte);flex:0 0 8px;}
/* La grille en matrice (maquette C) */
.grille-seuils{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:13px;margin-bottom:10px;}
.grille-nb{width:58px;font:inherit;font-size:13px;padding:3px 5px;border:1px solid var(--line);border-radius:6px;}
.grille-mat{border-collapse:collapse;font-size:13px;width:100%;}
.grille-mat th,.grille-mat td{border:1px solid var(--line);padding:6px 8px;text-align:center;}
.grille-mat th{background:var(--fond-doux);font-weight:600;font-size:12px;vertical-align:bottom;}
.grille-mat .grille-q{text-align:left;white-space:nowrap;}
.grille-mat tr.grille-exo td{background:var(--fond-doux);text-align:left;font-weight:700;}
.grille-mat tfoot td{font-weight:700;background:var(--fond-doux);}
.grille-mat tfoot td:first-child{text-align:left;}
.grille-mat td.couv-sous{background:var(--alerte-fond);box-shadow:inset 0 -3px 0 var(--signal);}
.grille-titre{margin:0 0 8px;font-size:15px;}
.grille-regles td:first-child{max-width:420px;font-size:13px;}
/* « Compte aussi pour » (N°319, maquette validée le 24/10) : la colonne teintée, la liste des 7. */
.grille-regles .grille-lien{background:var(--fond-doux);}
.grille-lien-choix{width:100%;min-width:300px;max-width:420px;font:inherit;font-size:13px;padding:4px 6px;
  border:1px solid var(--line);border-radius:6px;background:var(--card);}
.grille-lien-choix.pose{border-color:var(--accent);background:var(--accent-pale);}
.grille-deja{font-size:12px;color:var(--ok);}
/* L'éditeur de la grille par situations d'évaluation (N°369, maquette grille_situations du 31/10, états 2 et 3). */
.ed-cols{column-count:2;column-gap:22px;}
.ed-ex{break-inside:avoid;}
.ed-ex h4{margin:10px 0 4px;font-size:14px;}
.ed-titre{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--ink);cursor:pointer;text-align:left;}
.ed-titre:hover,.ed-titre:focus-visible{color:var(--accent-dark);}
.ed-q{display:grid;grid-template-columns:44px 1fr auto;gap:8px;align-items:baseline;padding:5px 6px;
  border-bottom:1px solid var(--line-doux);font-size:13.5px;cursor:pointer;}
.ed-q:hover,.ed-q:focus-visible{background:var(--fond-doux);}
.ed-rep{font-weight:700;color:var(--ink-2);}
.ed-cases{grid-column:2 / 4;font-size:12.5px;color:var(--muted);}
.ed-cases .btn-lien{font-size:12.5px;}
.sit-chip{display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:11.5px;border:1px solid var(--accent-bord);
  background:var(--accent-pale);color:var(--accent-dark);border-radius:10px;padding:0 7px;margin:0 2px;white-space:nowrap;cursor:pointer;}
.sit-chip.vide{background:var(--card);color:var(--muted);border-style:dashed;cursor:inherit;}
.sit-table td{font-size:13px;vertical-align:top;padding:5px 8px;}
.sit-table tr.po-ed{cursor:pointer;}
.sit-table tr.po-ed:hover,.sit-table tr.po-ed:focus-visible{background:var(--fond-doux);}
.sit-ok{color:var(--ok-texte);font-weight:600;}
.sit-manque{color:var(--alerte-texte);font-weight:600;}
.sit-prev{font-size:12.5px;color:var(--ink-2);background:var(--fond-doux);border-left:3px solid var(--line-fort);padding:5px 9px;margin:8px 0 0;}
.sit-crit{display:grid;grid-template-columns:52px 1fr;gap:6px 10px;align-items:start;margin:0 0 6px;}
.sit-q{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px;}
.sit-q label{display:inline-flex;gap:4px;align-items:center;}
.sit-ed-obs{list-style:none;margin:0;padding:0;}
.sit-ed-obs li{display:flex;gap:6px;align-items:center;margin:0 0 4px;}
.sit-ed-obs input{flex:1;font-size:13px;}
/* Corriger par situations d'évaluation (N°370, maquette du 31/10, états 4 et 5) : une situation, ses cinq niveaux. */
.sit-bloc{border:1px solid var(--line);border-radius:8px;padding:6px 9px;margin:4px 0 6px;background:var(--card);}
.sit-tete{display:flex;gap:8px;align-items:center;font-size:13px;margin-bottom:6px;}
.sit-niveaux{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;}
.sit-col{border:1px solid var(--line);border-radius:6px;padding:5px 7px;font-size:12.5px;line-height:1.3;background:var(--card);}
.sit-col.coche{background:var(--fond-doux);}
.sit-col.on{border:2px solid var(--accent);background:var(--accent-pale);}
.sit-col .nv{display:inline-flex;margin-bottom:3px;}
.sit-col label{display:flex;gap:5px;align-items:flex-start;padding:1px 0;cursor:pointer;}
.sit-col input{margin-top:2px;flex:none;width:auto;}
.sit-perso em{color:var(--ink-2);}
.sit-tag{font-size:10.5px;border:1px solid var(--line-fort);border-radius:8px;padding:0 5px;color:var(--muted);white-space:nowrap;}
.sit-main{border-color:var(--accent);color:var(--accent-dark);margin-left:4px;}
.sit-plus{display:inline-block;margin-top:2px;border:1px dashed var(--line-fort);background:transparent;border-radius:5px;
  padding:0 7px;color:var(--muted);cursor:pointer;font-size:12px;line-height:1.3;}
.sit-plus:hover,.sit-plus:focus-visible{color:var(--accent-dark);border-color:var(--accent);}
.sit-saisie{display:flex;flex-direction:column;gap:4px;margin-top:4px;}
.sit-saisie input[type=text]{font-size:12.5px;width:100%;box-sizing:border-box;}
.sit-saisie-l{display:flex;justify-content:space-between;align-items:center;gap:4px;}
.sit-saisie label{font-size:11.5px;display:flex;gap:4px;align-items:flex-start;}
.sit-pied{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:5px;font-size:12px;}
.sit-pied > span{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.sit-pied select{font:inherit;font-size:12px;min-height:24px;width:auto;padding:1px 26px 1px 6px;border:1px solid var(--line);border-radius:4px;margin-left:6px;}
.sit-eteint{opacity:.45;}
.sit-bloc-po{background:var(--fond-doux);}
.corr-res-sits{font-size:12px;color:var(--ink-2);}
/* La vue d'un groupe (N°371, état 6) : ce que chaque membre retient. */
.sit-membres{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;font-size:12.5px;margin-top:6px;padding-top:6px;border-top:1px solid var(--line-doux);}
.sit-saisie select{font:inherit;font-size:12px;min-height:22px;width:auto;padding:0 24px 0 6px;}

/* ---------- Sidebar : le groupe « Calendrier » (Boris, 19/10/2026) ----------
   Une entrée qui s'ouvre sur Cette semaine / Cette année quand on est dans l'une des
   deux. Repliée, la sidebar ne garde que l'icône du groupe (qui mène à Cette semaine). */
.nav a.nav-groupe.ouvert{color:var(--blanc);}
.nav .nav-chev{margin-left:auto;font-size:11px;opacity:.75;}
.nav a.nav-sous{padding:7px 16px 7px 50px;font-size:13.5px;}
.nav a.nav-sous .sb-ico{display:none;}
.sidebar.collapsed .nav a.nav-sous,.sidebar.collapsed .nav-chev{display:none;}
.sidebar.collapsed .nav a.nav-groupe.ouvert{background:var(--sb-hover);border-left-color:var(--sb-active);}
/* Le sous-menu du groupe (Boris, 30/10/2026 : repliée, l'emploi du temps n'était plus joignable). Dépliée : les
   entrées ne se montrent que dans le calendrier, comme avant. Repliée : au survol ou au focus de l'icône,
   `sidebar.js` pose `.montre` et la place (--menu-x, --menu-y) ; `position:fixed` échappe à l'`overflow` de la
   sidebar, comme la bulle `.sb-tip`. C'est la sidebar qui continue : mêmes couleurs, mêmes liens. */
.nav-bloc:not(.ouvert) .nav-menu,.nav-menu-titre{display:none;}
.sidebar.collapsed .nav-bloc .nav-menu{display:none;}
/* La sidebar est `sticky` : elle a son propre empilement, que les cartes positionnées de la page (la grille de
   l'emploi du temps) recouvraient — le menu passait dessous (vu au navigateur le 30/10). Repliée, elle passe
   au-dessus du contenu ; elle ne le chevauche jamais, seul son menu en sort. */
.sidebar.collapsed{z-index:30;}
.sidebar.collapsed .nav-bloc.montre .nav-menu{display:block;position:fixed;z-index:1000;left:var(--menu-x);top:var(--menu-y);
  min-width:200px;padding:6px 0;background:var(--sb-bg);border-radius:12px;box-shadow:0 6px 18px var(--ombre-3);}
.sidebar.collapsed .nav-bloc.montre .nav-menu-titre{display:block;padding:8px 18px 4px;font-size:11px;
  letter-spacing:.08em;color:var(--sb-muted);text-transform:uppercase;}
.sidebar.collapsed .nav-bloc.montre .nav-menu a.nav-sous{display:flex;justify-content:flex-start;margin:2px 6px;padding:8px 12px;}
.sidebar.collapsed .nav-menu .nav-label{display:inline;}

/* ---------- Calendrier › Cette année (maquette calendrier-annee.html, 19/10/2026) ----------
   La page tient sur un écran : les colonnes de mois prennent la hauteur restante, et
   les jours la partagent (un jour de semaine pèse 3, un week-end 1). */
.page-annee .main{height:100vh;}
.page-annee .tl-tip{white-space:pre-line;}
.an-contenu{display:flex;flex-direction:column;min-height:0;padding:8px 18px 10px;}
.an-annee{color:var(--bandeau-muted);font-weight:400;margin-left:4px;}
.an-barre{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;margin-bottom:8px;}
.an-nav{display:flex;align-items:center;gap:6px;}
.an-plage{min-width:150px;text-align:center;font-weight:600;font-size:13px;}
.an-filtres{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.an-chip{border:1px solid var(--line-fort);background:var(--card);border-radius:999px;padding:3px 11px;font:inherit;
  font-size:13px;cursor:pointer;color:var(--ink);display:inline-flex;align-items:center;gap:4px;
  white-space:nowrap;margin:0;font-weight:400;line-height:1.35;}
.an-chip:hover{border-color:var(--accent);}
.an-chip.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);}
.an-chip select{font:inherit;border:0;background:transparent;color:inherit;cursor:pointer;padding:0;}
.an-chip.on select option{color:var(--ink);}
.an-legende{margin-left:auto;display:flex;gap:10px;color:var(--muted);font-size:12px;align-items:center;}
.an-legende i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px;background:var(--c);}
.an-hach{background:repeating-linear-gradient(135deg,var(--line-fort) 0 3px,var(--fond-gris) 3px 6px) !important;}
.t-examen{--c:var(--cat-orange);} .t-reunion{--c:var(--cat-bleu);} .t-vie{--c:var(--cat-violet);} .t-echeance{--c:var(--cat-ambre);}
.t-sortie{--c:var(--cat-vert);} .t-trimestre{--c:var(--sb-bg);}
.an-mois{flex:1;min-height:0;display:grid;gap:8px;}
.an-col{display:flex;flex-direction:column;min-height:0;background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;}
.an-col.encours{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-bord);}
.an-col h2{margin:0;font-size:13px;font-weight:700;padding:5px 9px;background:var(--sb-bg);color:var(--blanc);
  display:flex;justify-content:space-between;flex:0 0 auto;}
.an-col.encours h2{background:var(--accent);}
.an-col h2 small{font-weight:500;opacity:.8;font-size:12px;}
.an-jours{flex:1;min-height:0;display:flex;flex-direction:column;}
.an-j{flex:3 1 0;min-height:0;display:flex;align-items:center;gap:4px;padding:0 6px 0 0;border-top:1px solid var(--line-doux);overflow:hidden;}
.an-j.we{flex:1 1 0;background:var(--fond-doux);border-top-color:var(--line-doux);}
.an-j.we .an-num{visibility:hidden;}
.an-j.we.plein{flex:3 1 0;}
.an-j.we.plein .an-num{visibility:visible;}
.an-j.lun{border-top-color:var(--line);}
.an-num{flex:0 0 36px;text-align:right;color:var(--muted);font-size:11.5px;font-variant-numeric:tabular-nums;padding-right:4px;}
.an-num b{color:var(--ink);font-weight:600;}
.an-j.auj{background:var(--accent-pale);}
.an-j.auj .an-num,.an-j.auj .an-num b{color:var(--accent);font-weight:700;}
.an-j.ferme{background:repeating-linear-gradient(135deg,var(--fond-gris) 0 4px,var(--fond-doux) 4px 8px);}
.an-lib-ferme{color:var(--muted);font-weight:600;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.an-j.fintrim{border-bottom:2px solid var(--sb-bg);}
.an-ev{flex:0 1 auto;min-width:0;display:inline-flex;align-items:center;border-radius:4px;padding:0 5px;
  font-size:11.5px;line-height:16px;white-space:nowrap;overflow:hidden;
  background:color-mix(in srgb,var(--c) 12%,var(--card));color:color-mix(in srgb,var(--c) 85%,var(--ink));
  border:1px solid color-mix(in srgb,var(--c) 30%,var(--blanc));}
.an-ev.incertain{border-style:dashed;}
.an-t{overflow:hidden;text-overflow:ellipsis;}
.an-ev.suite{width:6px;padding:0;flex:0 0 6px;height:14px;background:color-mix(in srgb,var(--c) 45%,var(--card));border:0;}
.an-ev.t-trimestre{background:var(--sb-bg);color:var(--blanc);border-color:var(--sb-bg);font-weight:600;}
.an-cis{flex:0 0 auto;font-size:12px;}
.an-pied{margin:6px 0 0;display:flex;gap:14px;font-size:12px;color:var(--muted);}
.an-illisible{color:var(--alerte);font-weight:600;}
/* Toute l'année : les libellés cèdent la place à des repères ; le détail passe dans la bulle. */
.an-mois.annee .an-num{flex-basis:22px;font-size:10.5px;}
.an-mois.annee .an-jl{display:none;}
.an-mois.annee .an-ev:not(.t-trimestre){width:9px;flex:0 0 9px;height:9px;padding:0;border-radius:2px;background:var(--c);border:0;}
.an-mois.annee .an-ev:not(.t-trimestre) .an-t{display:none;}
.an-mois.annee .an-ev.suite{opacity:.45;}
.an-mois.annee .an-ev.t-trimestre{padding:0 3px;font-size:10px;line-height:13px;}
.an-mois.annee .an-lib-ferme{font-size:10.5px;}
.an-mois.annee .an-col h2{font-size:12px;padding:4px 6px;}
.an-mois.annee .an-col h2 small{display:none;}

/* ---------- Espace ÉLÈVE de la Mémorisation (N°283, ADR-0007) ----------
   Écran étroit d'abord, une colonne, cibles ≥ 44 px ; le prénom en gros partout. */
.eleve-corps{margin:0;background:var(--bg);color:var(--ink);}   /* police : celle de `body` */
.eleve-tete{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:14px 18px;background:var(--card);border-bottom:1px solid var(--line);}
.eleve-prenom{font-size:24px;font-weight:700;color:var(--ink);}
.eleve-pas-toi{font-size:13px;color:var(--muted);}
/* « Pas toi ? » est un bouton de formulaire POST (audit du 20/10) habillé en lien. */
.eleve-deconnexion{margin:0;}
button.eleve-pas-toi{background:none;border:0;padding:0;font-family:inherit;
  text-decoration:underline;cursor:pointer;}
.eleve-page{max-width:640px;margin:0 auto;padding:16px;}
.eleve-carte{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:14px;}
.eleve-prete{border-color:var(--accent-bord);background:var(--fond-doux);}
.eleve-carte-titre{font-weight:700;font-size:16px;margin-bottom:4px;}
.eleve-bouton{display:flex;justify-content:center;min-height:44px;align-items:center;margin-top:12px;width:100%;box-sizing:border-box;}
.eleve-progression{margin-top:4px;}
/* La fin d'un quiz (N°302 b) : le score, en grand ; le bravo d'un sans-faute. */
.eleve-fin{text-align:center;}
.eleve-score{font-size:40px;font-weight:800;color:var(--ink);line-height:1.1;margin-top:8px;}
.eleve-bravo{margin-top:8px;font-weight:700;color:var(--ok-texte);}
.eleve-a-revoir{margin-top:16px;}
.eleve-mots{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:6px;}
.eleve-mot{background:var(--alerte-fond);color:var(--alerte-texte);border:1px solid var(--alerte-bord);border-radius:999px;padding:4px 12px;font-weight:600;font-size:14px;}
/* N°302 — l'état d'un quiz sur l'accueil (maquette `memorisation_eleve_etats_et_bravo`) :
   une pastille ronde à gauche, le mot de l'état à côté (l'icône seule ne suffit pas). */
.eleve-quiz{display:grid;grid-template-columns:52px 1fr;gap:4px 12px;align-items:center;}
.eleve-quiz > form,.eleve-quiz > .eleve-bouton{grid-column:1 / 3;}
.eleve-pastille{grid-row:1 / 3;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.eleve-pastille svg{width:24px;height:24px;}
.eleve-a-faire .eleve-pastille{background:var(--accent);color:var(--blanc);animation:eleve-appel 2.4s ease-out infinite;}
.eleve-en-pause .eleve-pastille{background:var(--alerte-fond);color:var(--alerte);border:2px solid var(--alerte-bord);}
.eleve-fini .eleve-pastille{background:var(--ok-fond);color:var(--ok);}
@keyframes eleve-appel{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent);}70%{box-shadow:0 0 0 12px transparent;}100%{box-shadow:0 0 0 0 transparent;}}
.eleve-etat{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.eleve-a-faire .eleve-etat{color:var(--accent);}
.eleve-en-pause .eleve-etat{color:var(--alerte-texte);}
.eleve-fini .eleve-etat{color:var(--ok-texte);}
/* N°305 — le quiz ciblé déjà fait (« Fait n fois », ↻ Recommencer) et le quiz global
   (« Toute l'année », toujours là) : maquette `memorisation_quiz_cible_global_2026-10-22`. */
.eleve-fait .eleve-pastille{background:var(--ok-fond);color:var(--ok);}
.eleve-fait .eleve-etat{color:var(--ok-texte);}
.eleve-global .eleve-pastille{background:var(--violet-fond);color:var(--violet);border:2px solid var(--violet-bord);}
.eleve-global .eleve-etat{color:var(--violet);}
.eleve-global .eleve-bouton.btn{background:var(--violet);border-color:var(--violet);}
.eleve-rang{font-size:13px;color:var(--muted);margin-top:2px;}
.eleve-progres{display:inline-block;margin-top:6px;font-size:13px;font-weight:600;color:var(--ok-texte);background:var(--ok-fond);border-radius:999px;padding:2px 10px;}
.eleve-entraine{margin:14px 0 4px;font-size:14px;background:var(--fond-doux);border-radius:10px;padding:10px 12px;text-align:left;}
.eleve-quoi{font-weight:600;}
.eleve-detail{grid-column:2;font-size:13px;color:var(--muted);}
.eleve-mini-barre{grid-column:2;height:6px;background:var(--line);border-radius:3px;overflow:hidden;margin-top:2px;}
.eleve-mini-barre > i{display:block;height:100%;background:var(--alerte);border-radius:3px;}
.eleve-bouton svg{width:16px;height:16px;margin-right:8px;flex-shrink:0;}
/* N°302 — le bravo du quiz élève (inspiré de Duolingo) : la réponse juste rebondit,
   quelques confettis, un bandeau monte du bas. Faux : un bandeau calme, sans secousse. */
.eleve-page .mem-choix-btn.mem-juste:disabled{animation:eleve-rebond .45s cubic-bezier(.3,1.6,.6,1);}
@keyframes eleve-rebond{0%{transform:scale(1);}40%{transform:scale(1.04);}100%{transform:scale(1);}}
.mem-serie{font-size:12px;font-weight:700;color:var(--danger);white-space:nowrap;opacity:0;transform:scale(.6);
  transition:opacity .2s,transform .25s cubic-bezier(.3,1.6,.6,1);}
.mem-serie.vue{opacity:1;transform:scale(1);}
.mem-bandeau{position:fixed;left:0;right:0;bottom:0;z-index:70;padding:16px 16px 20px;border-top:2px solid;
  transform:translateY(105%);transition:transform .28s cubic-bezier(.2,.9,.3,1.1);}
.mem-bandeau[hidden]{display:block;visibility:hidden;}
.mem-bandeau.monte{transform:none;visibility:visible;}
.mem-bandeau-dedans{max-width:640px;margin:0 auto;}
.mem-bandeau.ok{background:var(--ok-fond);border-color:var(--ok-bord);}
.mem-bandeau.ko{background:var(--fond-gris);border-color:var(--alerte-bord);}
.mem-bandeau-titre{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;margin-bottom:4px;}
.mem-bandeau.ok .mem-bandeau-titre{color:var(--ok-texte);} .mem-bandeau.ko .mem-bandeau-titre{color:var(--alerte-texte);}
.mem-medaille{width:38px;height:38px;border-radius:50%;background:var(--ok);color:var(--blanc);display:flex;align-items:center;justify-content:center;transform:scale(0);flex-shrink:0;}
.mem-bandeau.ko .mem-medaille{display:none;}
.mem-bandeau.monte.ok .mem-medaille{animation:eleve-pop .5s .1s cubic-bezier(.3,1.8,.5,1) forwards;}
.mem-medaille svg{width:22px;height:22px;stroke-dasharray:30;stroke-dashoffset:30;}
.mem-bandeau.monte.ok .mem-medaille svg{animation:eleve-trace .35s .35s ease-out forwards;}
@keyframes eleve-pop{to{transform:scale(1);}}
@keyframes eleve-trace{to{stroke-dashoffset:0;}}
.mem-bandeau-texte{font-size:14px;color:var(--ink);margin-bottom:12px;}
.mem-bandeau-texte p{margin:0 0 4px;}
.mem-bandeau .btn{width:100%;min-height:46px;font-weight:700;border:0;display:flex;align-items:center;justify-content:center;}
.mem-bandeau.ok .btn{background:var(--ok);box-shadow:0 4px 0 var(--ok);}
.mem-bandeau.ko .btn{background:var(--alerte);box-shadow:0 4px 0 var(--alerte);}
.mem-eclat{position:fixed;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:80;
  animation:eleve-eclat .75s cubic-bezier(.1,.7,.3,1) forwards;}
@keyframes eleve-eclat{from{transform:translate(0,0) rotate(0);opacity:1;}to{transform:translate(var(--dx),var(--dy)) rotate(var(--r));opacity:0;}}
/* N°330 (maquette du 27/10) — après une ERREUR, la correction au CENTRE (le bandeau du bas
   passait sans être lu) : les choix se resserrent, la carte s'écrit lettre à lettre, « Continuer »
   arrive en dernier, en fondu. Les teintes du « pas encore » du bandeau : calmes, sans rouge. */
.mem-apres-erreur .mem-choix{gap:4px;}
.mem-scene.mem-apres-erreur .mem-choix-btn{min-height:0;padding-top:6px;padding-bottom:6px;font-size:13px;}
.mem-carte-corr{margin:18px 0 8px;padding:18px 18px 16px;border:2px solid var(--alerte-bord);border-radius:16px;
  background:var(--blanc);cursor:pointer;animation:mem-carte-entre .3s ease-out;}
.mem-carte-corr[hidden]{display:none;}
@keyframes mem-carte-entre{from{opacity:0;transform:translateY(12px) scale(.98);}}
.mem-carte-corr-titre{font-size:17px;font-weight:800;color:var(--alerte-texte);margin-bottom:10px;}
.mem-carte-corr-texte{font-size:19px;line-height:1.5;color:var(--ink);min-height:4.5em;}
.mem-carte-corr-texte p{margin:0 0 6px;}
.mem-lettre{opacity:0;transition:opacity .12s;}
.mem-lettre.vu{opacity:1;}
.mem-carte-corr .btn{width:100%;min-height:48px;margin-top:14px;font-weight:700;border:0;display:flex;
  align-items:center;justify-content:center;background:var(--alerte);box-shadow:0 4px 0 var(--alerte);
  opacity:0;visibility:hidden;transition:opacity .6s;}
.mem-carte-corr .btn.vu{opacity:1;visibility:visible;}
@media (prefers-reduced-motion: reduce){
  .mem-carte-corr{animation:none;} .mem-lettre,.mem-carte-corr .btn{transition:none;}
}
/* Le quiz garde de la place sous lui pour le bandeau (sinon il cache les dernières lignes). */
.eleve-page .mem-scene[data-fete]{margin-bottom:200px;}
@media (prefers-reduced-motion: reduce){
  .eleve-a-faire .eleve-pastille,.eleve-page .mem-choix-btn.mem-juste:disabled{animation:none;}
  .mem-bandeau,.mem-serie{transition:none;}
  .mem-medaille{transform:none;} .mem-medaille svg{stroke-dashoffset:0;}
  .mem-bandeau.monte.ok .mem-medaille,.mem-bandeau.monte.ok .mem-medaille svg{animation:none;}
}
.eleve-page .mem-scene{max-width:none;}
.eleve-page .mem-choix-btn{min-height:44px;}
/* La page d'une classe (N°288, maquette du 21/10/2026) : le sous-titre de l'en-tête, une
   colonne de lecture bornée, et le Suivi qui défile DANS sa carte si la classe est longue. */
.entete-sous{margin:0;font-size:12px;color:var(--bandeau-muted);}
.mem-page-classe{max-width:1000px;}
.mem-suivi-defile{max-height:calc(100vh - 250px);overflow:auto;}
/* Préparer une session : Pour / Sur / Questions / Préparer ALIGNÉS sur une ligne, même
   hauteur (N°288). La règle « en colonne » ne vise que les champs du formulaire (`>`),
   jamais les cases des menus. */
.mem-preparer{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;}
.mem-preparer > label{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:3px;margin:0;}
.mem-preparer input[type=number]{width:80px;height:36px;box-sizing:border-box;padding:0 8px;}
.mem-preparer > .btn{height:36px;box-sizing:border-box;}
.mem-pioche{flex-basis:100%;font-size:12px;color:var(--muted);}
/* N°287 : « Pour » et « Sur », deux popovers à cases (maquette du 21/10/2026). Le bouton
   ne s'appelle plus `.mem-choix` : c'est AUSSI la grille des réponses d'une session
   (display:grid, marge de 14 px), qui le décalait. */
.mem-champ{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:3px;position:relative;}
.mem-champ-btn{font:inherit;font-size:14px;color:var(--ink);background:var(--card);border:1px solid var(--line);
  border-radius:6px;height:36px;box-sizing:border-box;padding:0 28px 0 10px;min-width:190px;max-width:260px;
  text-align:left;cursor:pointer;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mem-champ-btn::after{content:"▾";position:absolute;right:10px;color:var(--muted);}
.mem-champ-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.mem-pop{position:absolute;top:100%;left:0;margin-top:4px;background:var(--card);border:1px solid var(--line);
  border-radius:8px;box-shadow:0 8px 24px var(--ombre-2);padding:8px;z-index:20;width:280px;max-height:330px;
  overflow:auto;color:var(--ink);font-size:13px;}
.mem-pop[hidden]{display:none;}
.mem-pop-large{width:340px;}
.mem-pop label{display:flex;flex-direction:row;font-size:13px;color:var(--ink);gap:8px;align-items:center;padding:3px 4px;border-radius:4px;cursor:pointer;min-width:0;}
.mem-pop label:hover{background:var(--fond-doux);}
.mem-pop input[type=checkbox]{margin:0;flex-shrink:0;accent-color:var(--accent);}
.mem-pop-tous{font-weight:600;border-bottom:1px solid var(--line);margin-bottom:4px;padding-bottom:6px !important;}
.mem-pop-chap{font-weight:600;margin-top:2px;}
/* Menus dépliables du « Sur » (21/10) : le ▸ tourne quand le niveau est ouvert. */
.mem-pop-ligne{display:flex;align-items:center;gap:2px;min-width:0;}
.mem-pop-ligne > label{flex:1;min-width:0;}
.mem-pop-item{padding-left:20px;}
.mem-depl{background:none;border:0;cursor:pointer;width:20px;flex-shrink:0;color:var(--muted);font-size:11px;
  padding:4px 0;border-radius:4px;transition:transform .12s;}
.mem-depl[aria-expanded="true"]{transform:rotate(90deg);}
.mem-depl:focus-visible{outline:2px solid var(--accent);}
.mem-pop-sav{padding-left:64px !important;color:var(--muted);}
.mem-pop-lib{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mem-pop-vide{margin:4px;}
/* « Sessions préparées » en tableau (N°288) : une ligne par préparation, 🗑️ au bout. */
.mem-preps td:last-child{width:40px;text-align:right;}
.mem-prep-qui{font-weight:600;border-bottom:1px dotted var(--muted);cursor:default;}
.mem-inline{display:inline;}
.mem-poubelle{background:none;border:0;cursor:pointer;font-size:16px;padding:2px 6px;border-radius:6px;}
.mem-poubelle:hover,.mem-poubelle:focus-visible{background:var(--danger-fond);}
.mem-note{margin:8px 0 0;font-size:12px;}
/* L'arbre du Programme : chapitre → item → savoir, cases à trois états. */
.mem-panneau-programme{display:flex;flex-direction:column;gap:8px;}
.mem-prog-resume{background:var(--ok-fond);border:1px solid var(--ok-bord);border-radius:8px;padding:7px 12px;font-size:14px;}
.mem-prog-resume b{color:var(--ok-texte);}
.mem-prog-chap{border:1px solid var(--line);border-radius:8px;}
.mem-prog-ligne{display:flex;align-items:center;gap:8px;padding:4px 10px;min-height:30px;}
.mem-prog-ligne:hover{background:var(--fond-doux);}
.mem-prog-ligne-chap{font-weight:600;background:var(--fond-doux);border-radius:8px 8px 0 0;}
.mem-prog-item > .mem-prog-ligne{padding-left:28px;}
.mem-prog-savoir{padding-left:54px;font-size:13px;cursor:pointer;}
.mem-prog-enfants[hidden]{display:none;}
.mem-prog-depl{background:none;border:0;cursor:pointer;width:18px;padding:0;color:var(--muted);font-size:11px;flex-shrink:0;}
.mem-prog-depl-vide{width:18px;flex-shrink:0;}
.mem-case{width:16px;height:16px;margin:0;flex-shrink:0;accent-color:var(--accent);}
.mem-prog-code{font:12px ui-monospace,Menlo,monospace;color:var(--accent);white-space:nowrap;}
.mem-prog-lib{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mem-prog-compte,.mem-prog-date{color:var(--muted);font-size:12px;white-space:nowrap;font-weight:400;}
.mem-prog-nouveau{font-size:11px;font-weight:600;color:var(--danger-texte);background:var(--alerte-fond);border-radius:10px;padding:1px 7px;white-space:nowrap;}
.mem-prog-note{color:var(--muted);font-size:12px;margin:4px 0 0;}
.mem-prog-occupe{opacity:.6;pointer-events:none;}
.mem-attente{color:var(--accent);}
.btn-lien{border:none;background:none;padding:0;color:var(--muted);text-decoration:underline;cursor:pointer;font:inherit;}

/* ── Memo Quiz · Test (N°308, maquette memo_quiz_test_2026-10-23.html) ───────── */
.mem-tests{--test:var(--danger);--test-bg:var(--danger-fond);}
.mem-test-tete{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.mem-test-espace{flex:1;}
.mem-test-statut{font-size:12px;font-weight:700;border-radius:10px;padding:1px 8px;white-space:nowrap;}
.mem-st-a_composer{background:var(--fond-gris);color:var(--muted);}
.mem-st-pret{background:var(--accent-pale);color:var(--accent);}
.mem-st-ouvert{background:var(--test-bg);color:var(--test);}
.mem-st-ferme{background:var(--ok-fond);color:var(--ok-texte);}
.mem-btn-test{background:var(--test);border-color:var(--test);}
.mem-test-compo select{height:36px;min-width:260px;}
.mem-test-lot .table td{padding-top:3px;padding-bottom:3px;}
.mem-test-gestes{white-space:nowrap;width:1%;}
.mem-test-compteurs{display:flex;gap:22px;align-items:baseline;margin-bottom:8px;flex-wrap:wrap;}
.mem-test-compteurs b{font-size:24px;color:var(--ink);}
.mem-test-suivi{list-style:none;margin:0;padding:0;columns:3;column-gap:24px;}
.mem-test-suivi li{padding:4px 0;break-inside:avoid;}
.mem-test-suivi .sub{margin-left:6px;}
.mem-pastille{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle;background:var(--line-fort);}
.mem-p-fini{background:var(--ok);}
.mem-p-en_cours{background:var(--alerte);}
/* N°331 — le Rythme d'un élève (maquette memorisation_rythme_eleve_2026-10-27.html) : une
   pastille dans le Suivi, les chiffres dans l'infobulle (plusieurs lignes) ; sa page = ses
   quiz, du plus récent au plus ancien, une ligne par question. */
.mem-p-vert{background:var(--ok);}
.mem-p-orange{background:var(--alerte);}
.mem-p-rouge{background:var(--danger);}
.mem-rythme{display:inline-flex;align-items:center;cursor:default;}
.mem-rythme .mem-pastille{width:12px;height:12px;margin:0;}
body:has(.mem-rythme) .tl-tip{white-space:pre-line;max-width:320px;}
a.mem-eleve-lien{color:var(--accent-dark);font-weight:600;text-decoration:none;}
a.mem-eleve-lien:hover{text-decoration:underline;}
.mem-defile-quiz{max-height:calc(100vh - 250px);overflow:auto;padding-right:4px;}
.mem-quiz{padding:10px 0 14px;border-bottom:1px solid var(--line-doux);}
.mem-quiz:last-child{border-bottom:0;}
.mem-quiz-tete{display:flex;align-items:center;gap:10px;margin:0 0 6px;}
.mem-quiz-tete h3{margin:0;font-size:14.5px;}
.mem-quiz-tete .sub{margin-left:auto;}
table.mem-rep{width:100%;border-collapse:collapse;font-size:13px;}
table.mem-rep th{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
  text-align:left;font-weight:600;padding:5px 8px;border-bottom:1px solid var(--line);}
table.mem-rep td{padding:4px 8px;border-bottom:1px solid var(--line-doux);vertical-align:middle;}
table.mem-rep td.n{color:var(--muted);width:24px;}
table.mem-rep td.q{max-width:0;width:52%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
table.mem-rep td.t{white-space:nowrap;font-variant-numeric:tabular-nums;}
.mem-res-j{color:var(--ok-texte);font-weight:700;}
.mem-res-f{color:var(--danger-texte);font-weight:700;}
.mem-drapeau{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap;}
.mem-d-vite{background:var(--danger-fond);color:var(--danger-texte);}
.mem-d-long{background:var(--alerte-fond);color:var(--alerte-texte);}
.mem-d-lue{background:var(--ok-fond);color:var(--ok-texte);}
.mem-test-deux{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.mem-test-deux .mem-suivi-defile{max-height:calc(100vh - 330px);}
/* Les résultats (étape 4) : la colonne des élèves porte « Rouvrir pour… », « Laisser finir… » — 3/5 de la largeur. */
.mem-test-resultats{grid-template-columns:3fr 2fr;}
.mem-barre{display:inline-block;width:90px;height:8px;background:var(--line);border-radius:4px;overflow:hidden;vertical-align:middle;margin-right:6px;}
.mem-barre i{display:block;height:100%;background:var(--ok);}
.mem-barre-faible i{background:var(--alerte);}
.mem-radio{display:block;margin:6px 0;font-size:14px;}
.mem-test-compo{flex-wrap:nowrap;}
.mem-test-compo select{width:auto;max-width:340px;}
.mem-test-compo .mem-pioche{flex:1;min-width:0;font-size:12px;}
.mem-test-lot td.mem-test-savoir{white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis;}
.mem-test-lot .btn-sm{padding:2px 8px;}
.mem-tests .card{padding-top:12px;padding-bottom:12px;}
.mem-test-compo > label{flex:0 0 auto;}
.mem-test-lot{max-height:calc(100vh - 340px);overflow:auto;}
.mem-test-lot thead th{position:sticky;top:0;background:var(--card);}
.mem-test-deux td:nth-child(2), .mem-test-deux td:nth-child(3){white-space:nowrap;}

/* Memo Quiz · Test, côté élève (N°309) */
.eleve-test{border:2px solid var(--danger);}
.eleve-test .eleve-pastille{background:var(--danger);color:var(--blanc);font-size:22px;}
.eleve-test .eleve-etat{color:var(--danger-texte);}
.eleve-test .eleve-bouton.btn{background:var(--danger);border-color:var(--danger);}
.eleve-test-fait{border:1px solid var(--line);}
.eleve-test-fait .eleve-pastille{background:var(--danger-fond);color:var(--danger-texte);}
.eleve-test-tete{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:6px;gap:8px;}
.eleve-test-barre{margin-bottom:14px;}
.eleve-test-barre i{background:var(--danger);}
.eleve-test-choix{border:0;margin:0;padding:0;}
.eleve-test-enonce{font-size:18px;font-weight:600;color:var(--ink);margin:0 0 14px;padding:0;}
.eleve-test-choix label{display:flex;gap:10px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:12px 14px;margin-bottom:10px;cursor:pointer;}
.eleve-test-choix label:has(input:checked){border:2px solid var(--danger);background:var(--danger-fond);}
.eleve-test-valider.btn{background:var(--danger);border-color:var(--danger);}
.eleve-test-encadre{margin:14px 0 4px;font-size:14px;background:var(--fond-doux);border-radius:10px;padding:10px 12px;text-align:left;}

/* N°311 : le lien d'une étape « Memo Quiz · Test » vers son test (En classe, encadré) */
.ec-lien-test{background:var(--danger);border-color:var(--danger);white-space:nowrap;}
.enc-lien-test{margin-left:6px;font-size:12px;font-weight:600;color:var(--danger-texte);white-space:nowrap;text-decoration:none;}
.enc-lien-test:hover{text-decoration:underline;}

/* ---------- N°316 : l'onglet Bilan de Mes classes (maquette validée le 22/10) ----------
   Tient sur 1280 × 657 : le tableau défile seul (en-têtes collés) si la classe est longue. */
.bil{gap:8px;}
.bil-barre{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:2px;}
.bil-lab{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;}
/* `.bil-seg` (la période) : sa 1re version est retirée le 24/10 (N°321) ; son filet `a + a` restait sous la
   v4 (plus bas) et coupait T2 | T3 | Année d'un trait. */
.bil-couv{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;background:var(--card);border:1px solid var(--line);
  border-radius:8px;padding:5px 10px;font-size:13px;}
.bil-chip{display:inline-block;padding:0 7px;border-radius:10px;background:var(--fond-gris);font-size:12px;}
.bil-alerte{font-size:12px;color:var(--alerte-texte);background:var(--alerte-fond);border:1px solid var(--alerte-bord);border-radius:7px;padding:1px 8px;}
.bil-cadre{padding:0;overflow:auto;max-height:calc(100vh - 262px);}
.bil-table{border-collapse:separate;border-spacing:0;width:100%;font-size:12px;}
.bil-table th,.bil-table td{padding:3px 4px;text-align:center;border-bottom:1px solid var(--line);}
.bil-table thead th{position:sticky;background:var(--fond-doux);z-index:1;font-weight:600;font-size:11.5px;}
.bil-table thead tr:nth-child(1) th{top:0;height:24px;}
.bil-table thead tr:nth-child(2) th{top:24px;height:34px;line-height:1.2;}
.bil-table thead tr:nth-child(3) th{top:58px;}
.bil-table tfoot td{position:sticky;bottom:0;background:var(--fond-doux);}
.bil-fam{text-align:left !important;padding-left:8px !important;color:var(--ink);}
.bil-competence_travaillee{border-bottom:3px solid var(--accent) !important;}
.bil-theme,.bil-hors_liste{border-bottom:3px solid var(--muted) !important;}
.bil-col{min-width:58px;max-width:110px;}
.bil-cv{font-weight:400 !important;color:var(--muted);font-size:11px !important;}
.bil-off{color:var(--discret);font-weight:400;}
.bil-sep{border-left:6px solid var(--bg) !important;}
th.bil-nom,td.bil-nom{text-align:left;padding-left:10px;white-space:nowrap;position:sticky;left:0;background:var(--card);z-index:2;}
thead th.bil-nom{z-index:3;background:var(--fond-doux);}
td.bil-nom a{color:var(--ink);text-decoration:none;}
td.bil-nom a:hover{text-decoration:underline;}
.bil-p{display:inline-flex;min-width:34px;height:20px;font-size:11.5px;cursor:default;}
.bil-vide{justify-content:center;align-items:center;background:var(--fond-gris);color:var(--discret);border-radius:4px;}
/* N°318 — corriger un résumé (maquette validée le 24/10) : la pastille d'un groupe, sur un trimestre, est un
   bouton ; pas évaluée, elle est en pointillés ; corrigée, elle porte une « * ». L'encadré est en position
   fixe : les cartes du Bilan coupent ce qui déborde. */
button.bil-rc{border:0;font:inherit;font-size:11.5px;font-weight:600;justify-content:center;align-items:center;
  border-radius:4px;padding:0 4px;cursor:pointer;}
button.bil-rc.bil-vide{background:transparent;border:1px dashed var(--line-fort);color:var(--discret);}
button.bil-rc:hover,button.bil-rc:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.bil-et{font-weight:800;margin-left:1px;}
/* Le cadenas (Boris, 24/10) : fermé, les pastilles redeviennent des étiquettes — ni contour au survol, ni
   pointillés, curseur normal ; le bouton montre l'icône de l'état. */
.bil-verrouille button.bil-rc{cursor:inherit;}
.bil-verrouille button.bil-rc:hover{outline:none;}
.bil-verrouille button.bil-rc.bil-vide{background:var(--fond-gris);border:0;color:var(--discret);}
.bil-verrou .bil-verrou-ouvert,.bil-verrou[aria-pressed="true"] .bil-verrou-ferme{display:none;}
.bil-verrou[aria-pressed="true"] .bil-verrou-ouvert{display:inline-flex;}
/* Ouvert = rouge (Boris, 24/10) : on voit d'un coup d'œil que la modification est permise. */
.bil-verrou[aria-pressed="true"]{background:var(--danger);color:var(--blanc);border-color:var(--danger);}
.bil-rc-pop{position:fixed;z-index:60;width:260px;background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 8px 24px var(--ombre-2);padding:10px 12px;font-size:12.5px;color:var(--ink);}
.bil-rc-q{font-weight:700;margin-bottom:2px;}
.bil-rc-prop{color:var(--muted);margin-bottom:8px;}
.bil-rc-niv{display:flex;gap:5px;margin-bottom:8px;}
.bil-rc-niv button{flex:1;border:2px solid transparent;border-radius:5px;padding:4px 0;font:inherit;font-weight:700;
  font-size:12px;cursor:pointer;}
.bil-rc-niv button.on{border-color:var(--ink);}
.bil-rc-niv button.prop{box-shadow:inset 0 -3px 0 var(--ombre-3);}
.bil-rc-niv button:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.bil-rc-retour{background:none;border:0;padding:0;color:var(--accent);font:inherit;cursor:pointer;}
.bil-rc-retour:disabled{color:var(--discret);cursor:default;}
.bil-rc-erreur{margin:6px 0 0;color:var(--danger);}
.bil-mini{display:flex;gap:2px;justify-content:center;margin-top:2px;}
.bil-mini i{width:10px;height:4px;border-radius:2px;}
.bil-distrib{display:flex;height:9px;border-radius:3px;overflow:hidden;width:46px;margin:0 auto;}
.bil-distrib i{display:block;height:100%;}
.bil-acq{font-size:10.5px;}
.bil-legende{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:11.5px;}
.bil-legende .nv{min-width:30px;height:18px;font-size:11px;}
.bil-eleve-vue{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start;}
.bil-bloc{padding:6px 10px;}
.bil-bloc h3{margin:0 0 4px;font-size:13px;color:var(--ink);}
.bil-ligne{display:grid;grid-template-columns:1fr 40px 150px 96px;gap:8px;align-items:center;padding:4px 0;
  border-top:1px solid var(--line);font-size:12.5px;}
.bil-ligne .bil-t{font-weight:600;}
.bil-item{padding:2px 0 2px 14px;border-top:1px dashed var(--line);font-size:12px;}
.bil-item .bil-t{font-weight:400;}
.bil-serie{display:flex;gap:4px;flex-wrap:wrap;}
.bil-pt{min-width:0;height:18px;padding:0 4px;font-size:10.5px;}
.bil-calc{font-size:11px;}
.bil-ligne .bil-t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bil-ligne{grid-template-columns:minmax(0,1fr) 40px auto 92px;}
/* Retours de Boris du 24/10 : listes déroulantes, sans titres ; plus de bandeau ni de légende. */
.bil-cadre{max-height:calc(100vh - 200px);}

/* ---------- La bande du haut, harmonisée sur toutes les pages (Boris, 24/10/2026 : « Harmonise la
   bande supérieure comme l'autre », celle d'une progression ou d'une classe) ----------
   Même hauteur (45,5 px) et même dessin que « PROGRESSION › Physique-Chimie · 6e ▾ » :
   la racine en petites capitales, « › », puis la page en gras. Le fil garde son HTML (capteurs
   test_reperage_*) : son dernier maillon, que le <h1> redit, est masqué ; une page racine (un seul
   maillon, pas de fil) écrit son <h1> comme la racine. */
.topbar .titre-page{flex-direction:row;align-items:center;gap:8px;min-height:39.5px;}
.topbar .fil{font-size:12px;}
.topbar .fil ol{gap:8px;flex-wrap:nowrap;}
.topbar .fil li{gap:8px;white-space:nowrap;}
.topbar .fil li + li::before{color:var(--bandeau-muted);opacity:.7;}
.topbar .fil li:first-child a{color:var(--bandeau-muted);font-weight:400;letter-spacing:.08em;text-transform:uppercase;}
.topbar .fil li:not(:first-child) a{color:var(--bandeau-muted);font-size:13px;}
.topbar .fil a:hover{color:var(--blanc);text-decoration:none;}
.topbar .fil li:last-child{display:none;}
.topbar .fil ol::after{content:'›';color:var(--bandeau-muted);opacity:.7;}
.topbar .titre-page > h1:not(.entete-prog){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.topbar .titre-page > h1:only-child:not(.entete-prog){font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;}
/* N°317 — titre et onglets sur UNE bande (pages d'une classe ; Boris, 24/10/2026, maquette
   `entete_une_bande.html`, sources `docs/ux/entete-onglets-conclusions.md`). Les onglets suivent
   le titre, après un trait ; ils touchent le BAS de la bande, donc le haut du contenu (NN/g :
   proximité onglet ↔ panneau) ; pas de trait pleine largeur entre eux et le contenu (Primer) ;
   la droite reste aux actions. Même hauteur que les autres bandes : le titre ne saute pas. */
.topbar.une-bande{justify-content:flex-start;align-items:stretch;padding:0 24px;border-bottom:0;min-height:46.5px;}
.une-bande .titre-page{flex:0 1 auto;}
.une-bande .bande-sep{align-self:center;flex:none;width:1px;height:22px;background:var(--sur-sombre-3);margin:0 4px 0 6px;}
.une-bande .tabs{padding:0;border-bottom:0;background:none;align-items:stretch;flex:none;}
.une-bande .tabs a{display:flex;align-items:center;margin-bottom:0;padding:0 14px;white-space:nowrap;
  border-top:3px solid transparent;}  /* contrepoids du trait bas : texte des onglets centré comme le titre (Boris, 24/10) */
/* Sous une bande à onglets, le contenu monte : l'onglet touche déjà son panneau, 24 px de vide le décollaient
   (Boris, 24/10 : « règle les espacements entre le menu de 2e ligne et le 1er »). */
.stickytop:has(.une-bande) + .content{padding-top:14px;}
.une-bande .bande-actions{margin-left:auto;align-self:center;}
/* Les réglages du Bilan = menus du site (Boris, 24/10) : bouton clair comme .btn-secondary, liste
   `.entete-pop` (carte blanche, survol bleu pâle, choix courant en accent) — plus de liste native. */
.bil-menu > summary{gap:6px;padding:4px 10px;background:var(--card);border:1px solid var(--line);font-size:13px;
  font-weight:600;color:var(--ink);white-space:nowrap;min-height:28px;}
.bil-menu > summary:hover,.bil-menu[open] > summary{border-color:var(--accent);background:var(--accent-pale);}
.bil-menu > summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.bil-menu .entete-chevron{color:var(--muted);}
.bil-menu .entete-pop{min-width:200px;font-size:13px;}
.bil-menu .entete-pop a.on::before{content:'✓';display:inline-block;width:16px;margin-left:-4px;}
.bil-menu .entete-pop a:not(.on){padding-left:22px;}
/* Vue Élève (Boris, 24/10) : le nom et le niveau seulement ; un clic sur la ligne d'un groupe déplie ses items. */
.bil-ligne{grid-template-columns:minmax(0,1fr) 40px;}
.bil-groupe > summary{list-style:none;cursor:pointer;}
.bil-groupe > summary::-webkit-details-marker{display:none;}
.bil-groupe > summary .bil-t::before{content:'▸';display:inline-block;width:14px;color:var(--muted);transition:transform .15s;}
.bil-groupe[open] > summary .bil-t::before{transform:rotate(90deg);}
.bil-groupe > summary:hover{background:var(--fond-doux);}
.bil-groupe > summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.bil-bloc > .bil-off .bil-t{padding-left:14px;}
.bil-item{padding-left:28px;}
/* Le détail d'un groupe (Boris, 24/10 : « je ne distingue plus les parties de chaque thème ») :
   encadré teinté + filet à gauche ; items = bâtonnets de couleur sans texte (niveau au survol). */
.bil-detail{margin:0 0 6px 7px;padding:0;border-left:1px solid var(--line);}  /* retrait + filet fin, sans fond (maquette v4, Primer TreeView) */
.bil-detail .bil-item{padding-left:15px;border-top:0;color:var(--muted);}
.bil-detail .bil-item:first-child{border-top:0;}
.bil-groupe[open] > summary{border-bottom:0;}
/* Une petite barre verticale par évaluation de l'item (Boris, 24/10), dans l'ordre des dates. */
.bil-batons{display:flex;gap:3px;justify-self:center;align-items:center;}
.bil-batons i{display:block;width:5px;height:16px;border-radius:2px;}
/* La flèche « tout déplier » du titre d'un bloc (Boris, 24/10) : même ▸ que les lignes. */
.bil-tout{font:inherit;color:inherit;background:none;border:0;padding:2px 4px 2px 0;cursor:pointer;display:inline-flex;align-items:center;}
.bil-tout::before{content:'▸';display:inline-block;width:14px;color:var(--muted);transition:transform .15s;}
.bil-tout[aria-expanded="true"]::before{transform:rotate(90deg);}
.bil-tout:hover{color:var(--accent);}
.bil-tout:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px;}
.bil-tout:disabled{cursor:default;}
.bil-tout:disabled::before{visibility:hidden;}
/* La ligne titre d'un bloc (« Compétences », « Thèmes ») sur un fond léger (Boris, 24/10). */
.bil-bloc{padding:0 10px 6px;overflow:hidden;}
.bil-bloc h3{margin:0 -10px 4px;padding:6px 10px;background:var(--fond-gris);border-bottom:1px solid var(--line-fort);}
/* Retour du 24/10 : fond du titre plus marqué (distinct du fond de page), sans filet dessous. */
.bil-bloc h3{background:var(--tete);border-bottom:0;}
.bil-bloc h3 + .bil-ligne,.bil-bloc h3 + details > summary.bil-ligne,.bil-bloc h3 + p{border-top:0;}

/* ---------- N°320 — Identité, sidebar en capsule, en-tête clair (Boris, 24/10/2026, maquette v4 « B ») ----------
   Sources : docs/ux/imbrication-premium-theme-conclusions.md. La sidebar est le SEUL objet sombre ; l'en-tête des
   pages est posé sur le papier (texte encre, onglet actif souligné sarcelle, un filet le colle au contenu). */

/* Sidebar : une capsule détachée des bords ; l'élément actif est une tuile arrondie (même rayon que les cartes),
   plus un trait au bord ; trois zones (navigation · utilitaires · moi, tout en bas). */
.sidebar{margin:10px 0 10px 10px;border-radius:18px;height:calc(100vh - 20px);position:sticky;top:10px;overflow:hidden;}
.sidebar .sb-head{padding:16px 18px 10px;}
.sidebar .sb-logo{border-radius:10px;}
.sidebar .nav{padding:8px 0;}
.sidebar .nav a{margin:2px 10px;padding:9px 12px;border-left:0;border-radius:10px;}
.sidebar .nav a:hover{background:var(--sur-sombre-1);color:var(--blanc);}
.sidebar .nav a.active{background:var(--sur-sombre-2);color:var(--blanc);font-weight:600;}
.sidebar.collapsed .nav a{margin:2px 6px;padding:9px 0;justify-content:center;}
.sidebar.collapsed .sb-action{margin-left:6px;margin-right:6px;}
.sidebar.collapsed .sb-foot-id{margin-left:6px;margin-right:6px;}
.sidebar .sb-toggle{color:var(--sb-muted);}
.sidebar .sb-foot{border-top:0;padding:6px 0 10px;}
.sidebar .sb-action{margin:1px 10px;width:auto;padding:8px 12px;border-left:0;border-radius:10px;font-size:13px;color:var(--sb-muted);}
.sidebar .sb-action:hover,.sidebar .sb-action.active{background:var(--sur-sombre-1);color:var(--blanc);}
.sidebar .sb-foot form{order:8;}
.sidebar .sb-foot-id{order:9;margin:8px 10px 0;padding:10px 12px;border-radius:10px;background:var(--sur-sombre-1);}
.sidebar.collapsed .sb-foot-id{padding:8px 0;}
/* N°321 (Boris, 24/10 : « contenu à réaligner ») : repliée, le logo et la Déconnexion sortaient de l'axe des
   icônes (mesuré : logo +3 px, Déconnexion −10 px). Le bouton de Déconnexion vit dans un <form> : il ne
   s'étirait pas comme ses voisins ; le logo gardait le retrait de 18 px de la sidebar dépliée. */
.sidebar .sb-foot form{display:flex;flex-direction:column;}
.sidebar.collapsed .sb-head{padding-left:0;padding-right:0;justify-content:center;}

/* En-tête clair : les jetons « bandeau » sont redéfinis DANS l'en-tête (les volets gardent leur bande sombre). */
.stickytop{--bandeau:var(--bg);--bandeau-txt:var(--ink);--bandeau-muted:var(--muted);background:var(--bg);}
.topbar{border-bottom:1px solid var(--line);margin:0 10px;padding-left:14px;padding-right:14px;}
.topbar.une-bande{padding:0 14px;border-bottom:1px solid var(--line);}
.tabs{border-bottom:1px solid var(--line);margin:0 10px;padding-left:14px;}
.tabs a:hover,.stickytop .tabs a:hover{color:var(--ink);}
.tabs a.active{color:var(--ink);border-bottom-color:var(--onglet-actif);}
.tabs a:focus-visible,.year-switch a:focus-visible{outline-color:var(--accent);}
.tabs a .pill{background:var(--accent-pale);color:var(--muted);}
.fil a,.fil [aria-current]{color:var(--muted);}
.fil a:hover,.topbar .fil a:hover,.entete-racine:hover{color:var(--ink);}
.year-switch a.on{background:var(--accent);color:var(--blanc);}
.entete-menu > summary:focus-visible{outline-color:var(--accent);}
.entete-reglages > summary:hover,.entete-reglages[open] > summary,.entete-reglages > summary.on{color:var(--ink);background:var(--accent-pale);}
/* « 3e ▾ » se lit comme un SÉLECTEUR (bord + chevron), pas comme un maillon de fil (NN/g Breadcrumbs). */
.entete-choix > summary{margin-left:0;padding:3px 10px;border:1px solid var(--line);background:var(--card);}
.entete-choix > summary:hover,.entete-choix[open] > summary{border-color:var(--accent);background:var(--card);}

/* Bilan : les réglages de la maquette v4 — un nom gris, puis la forme propre à chaque réglage. */
.bil-barre{gap:16px;}
.bil-reg{display:flex;align-items:center;gap:6px;}
.bil-reg-lib{font-size:12px;color:var(--muted);}
.bil-seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:2px;}
.bil-seg a{padding:3px 11px;border-radius:6px;font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;}
.bil-seg a:hover{color:var(--ink);background:var(--accent-pale);}
.bil-seg a.on{background:var(--accent);color:var(--blanc);}
.bil-seg a:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
.bil-pas{display:inline-flex;align-items:center;gap:4px;}
.bil-pas-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--line);
  background:var(--card);border-radius:8px;color:var(--ink);text-decoration:none;font-size:11px;}
.bil-pas-btn:hover{border-color:var(--accent);}
.bil-pas-btn.off{opacity:.35;pointer-events:none;}
/* N°322 — les connaissances : un % par évaluation (pas un niveau : pas de couleur de niveau). */
.bil-colonne{display:grid;gap:12px;align-content:start;}
.con-pct{font-variant-numeric:tabular-nums;font-weight:600;font-size:12px;}
.con-abs{color:var(--muted);font-size:11px;font-style:italic;}
.con-type{display:inline-block;font-size:10px;font-weight:600;color:var(--muted);border:1px solid var(--line);
  border-radius:3px;padding:0 4px;margin-left:6px;vertical-align:1px;}
.con-ligne{display:grid;grid-template-columns:minmax(0,1fr) 72px 90px 42px;gap:8px;align-items:center;padding:5px 0;
  border-top:1px solid var(--line);font-size:12.5px;}
.bil-bloc h3 + .con-ligne{border-top:0;}
.con-ligne .bil-t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;}
.con-date{color:var(--muted);font-size:11.5px;text-align:right;}
.con-barre{height:7px;background:var(--fond-gris);border-radius:4px;overflow:hidden;}
.con-barre i{display:block;height:100%;background:var(--accent);}
.con-ligne .con-pct{text-align:right;}
.con-large{grid-column:span 2;text-align:right;}
/* Le groupe Calendrier : ses sous-entrées suivent la tuile, en retrait sous l'icône du groupe. */
.sidebar .nav a.nav-sous{padding:7px 12px 7px 46px;}
.sidebar.collapsed .nav a.nav-groupe.ouvert{background:var(--sur-sombre-2);}
/* Mes classes › Résumé (N°325) : une ligne par cours, lignes serrées comme `.classe-eleves`. Un 0 sur une
   période commencée se signale en orange (comme la couverture du DS, jamais en rouge). */
.res-carte{padding:0;}
.res-classes td,.res-classes th{white-space:nowrap;}
.res-classes td{padding-top:4px;padding-bottom:4px;vertical-align:middle;}
.res-classes tr.res-debut td{border-top:2px solid var(--line);}
.res-classes .res-classe{font-weight:700;max-width:170px;overflow:hidden;text-overflow:ellipsis;}
.res-nb{font-variant-numeric:tabular-nums;}
.res-eval{display:inline-block;min-width:16px;font-weight:700;}
.res-zero{color:var(--signal);font-weight:700;}
.res-cases{display:inline-flex;gap:3px;vertical-align:middle;margin-right:6px;}
.res-cases i{width:12px;height:12px;border-radius:3px;background:var(--grid-line);}
.res-cases i.on{background:var(--accent);}
.res-jauge{display:inline-block;width:50px;height:7px;border-radius:4px;background:var(--grid-line);vertical-align:middle;margin-right:6px;overflow:hidden;}
.res-jauge b{display:block;height:100%;background:var(--accent);}

/* N°327 — Noter un DS de lycée, et son Bilan (maquette notes_lycee.html, vues 2 et 3). */
.notes-tete{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:10px;}
.notes-tete h2{margin:0;font-size:17px;}
.notes-tete label{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin:0;}
.notes-tete input{width:70px;text-align:right;}
.notes-table td{vertical-align:middle;}
.notes-table input[name=note]{width:70px;text-align:right;}
.notes-table tfoot td,.notes-bilan .moy{font-weight:600;}
.notes-table .nb,.notes-bilan .nb{font-variant-numeric:tabular-nums;white-space:nowrap;}
.notes-bilan .coef{font-size:11px;color:var(--muted);font-weight:400;text-transform:none;letter-spacing:0;}

/* N°328 — Corriger un practical work d'IB (maquette notes_lycee.html, vues 4-5) : une page tient sur un écran. */
.pw-choix{display:flex;align-items:center;gap:10px;margin:8px 0;}
.pw-choix select{width:auto;}
.pw-tete{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:8px;}
.pw-tete h2{margin:0;font-size:16px;}
.pw-eleves{display:inline-flex;align-items:center;gap:6px;margin-left:auto;}
.pw-eleves select{width:auto;}
.pw-finie{display:inline-flex;align-items:center;gap:4px;margin:0;}
.pw-grille{font-size:12.5px;}
.pw-grille th,.pw-grille td{padding:1px 8px;height:23px;vertical-align:middle;line-height:1.2;}
.pw-grille tr.pw-crit td{background:var(--fond-gris);font-weight:700;font-size:12px;}
.pw-bilan{font-weight:400;color:var(--muted);margin-left:10px;}
.pw-band{display:inline-flex;align-items:center;gap:6px;margin-left:14px;font-weight:400;white-space:nowrap;}
.pw-band select{width:auto;font-size:12px;height:19px;padding:0 4px;}
.pw-skill{width:320px;}
.pw-skill > span:first-child{border-bottom:1px dotted var(--muted);cursor:help;}
.pw-seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.pw-seg button{border:0;background:var(--blanc);width:26px;height:19px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;border-left:1px solid var(--line);padding:0;}
.pw-seg button:first-child{border-left:0;}
.pw-seg button.on[data-v="0"]{background:var(--danger);color:var(--blanc);}
.pw-seg button.on[data-v="1"]{background:var(--alerte);color:var(--blanc);}
.pw-seg button.on[data-v="2"]{background:var(--accent);color:var(--blanc);}
.pw-com{width:100%;font-size:12px;padding:1px 6px;height:19px;box-sizing:border-box;}
.pw-gf{width:110px;white-space:nowrap;}
.pw-gf label{display:inline-flex;align-items:center;gap:4px;margin:0;}
.pw-gf input{margin:0;width:14px;height:14px;padding:0;}

/* ── La Recherche (⌘K, cadrage du 27/10/2026) : la loupe en tête de la barre, la case au centre ── */
.sidebar:not(.collapsed) .nav a.nav-recherche .nav-label{flex:1;display:flex;align-items:center;}
.nav a.nav-recherche kbd{margin-left:auto;font:11px/1 inherit;padding:2px 5px;border-radius:4px;
  border:1px solid var(--sb-muted);color:var(--sb-muted);}
.rch-dialog{max-width:640px;width:92vw;padding:0;margin-top:12vh;overflow:hidden;}
.rch-barre{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line-doux);color:var(--muted);}
.rch-barre input{flex:1;border:none;outline:none;font-size:16px;padding:4px 0;background:none;color:var(--ink);box-shadow:none;}
.rch-barre kbd,.rch-dialog kbd{font:11px/1 inherit;padding:2px 5px;border-radius:4px;border:1px solid var(--line);color:var(--muted);}
.rch-etat{margin:0;padding:8px 16px 4px;font-size:12px;color:var(--muted);}
.rch-etat:empty{display:none;}
.rch-liste{list-style:none;margin:0;padding:4px 8px 10px;max-height:min(60vh,460px);overflow-y:auto;}
.rch-ligne{display:flex;align-items:baseline;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;}
.rch-ligne[aria-selected="true"]{background:var(--accent-pale);}
.rch-type{flex:0 0 78px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;}
.rch-type.rch-sequence{color:var(--accent);font-weight:600;}
.rch-titre{flex:1;min-width:0;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rch-ligne[aria-selected="true"] .rch-titre{font-weight:600;}
.rch-ou{flex:0 0 auto;max-width:40%;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* Bilan « Tous » (cadrage Recherche, 27/10) : la section d'un cours ne crée pas de boîte (la pile garde son
   espacement) ; son titre sépare la PC de la Techno. */
.bil-section{display:contents;}
.bil-cours-titre{margin:6px 0 -4px;font-size:15px;font-weight:700;color:var(--ink);}

/* ---------- Typographie du style identité (N°342, variante C du 29/10) ----------
   Marcellus SC n'a qu'une graisse : les titres passent en 400 (sinon le navigateur fabrique un faux gras).
   Boutons, champs et pastilles de niveau gardent la police système : ils se lisent d'un coup d'œil.
   `!important` ici seulement : une centaine de règles écrivent `font:inherit` sur un bouton ou un champ,
   et rapporteraient sinon la police du texte. */
h1,h2,h3,th,.tabs a,.sb-title,.eleve-prenom,.eleve-carte-titre{font-family:var(--police-titre);font-weight:400;letter-spacing:.03em;}
button,input,select,textarea,.btn,kbd,.nv,.corr-niv,.mn-niv,.mem-pastille,.eleve-mot{font-family:var(--police-ui) !important;}
/* N°366 — les notions d'un chapitre, cochées dans le programme (réglages du chapitre). */
.mem-ch-notions{max-height:46vh;overflow:auto;border:1px solid var(--line);border-radius:6px;padding:4px 8px;}
.mem-ch-theme > summary{cursor:pointer;padding:6px 0;font-weight:500;}
.mem-ch-item{display:flex;align-items:baseline;gap:8px;padding:3px 0 3px 18px;font-weight:400;}