/* ===================================================================== */
/*  Registre des notions (lot C, chantier C0) — préfixe `no-`               */
/*  Une feuille par famille : celle-ci ne style que ses classes. Les états  */
/*  pleins consomment un quintet de tokens (jamais de #fff sur un pigment).  */
/* ===================================================================== */
.no-pitch { margin: 0 0 var(--sp-3, 12px); }
.no-card { display: flex; flex-direction: column; gap: var(--sp-3, 12px); }
.no-tete { display: flex; flex-direction: column; gap: var(--sp-2, 8px); }
.no-champ { display: flex; flex-direction: column; gap: 4px; max-width: 420px; }
.no-barre { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2, 8px); }
.no-recherche { flex: 1 1 220px; min-width: 0; }
.no-masquees { font-family: var(--sans); font-size: 13px; color: var(--ink-soft); display: inline-flex; align-items: center; gap: 4px; }
.no-vide { display: flex; flex-direction: column; gap: var(--sp-2, 8px); padding: var(--sp-2, 8px) 0; }
.no-vide-t { margin: 0; font-family: var(--sans); color: var(--ink-soft); }
.no-sections { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.no-section.is-active { background: var(--c-surface); color: var(--c-on); border-color: var(--c-surface); }
.no-hors, .no-sans-plan { font-family: var(--sans); font-size: 12.5px; }
.no-creation { padding: var(--sp-2, 8px); border: 1px dashed var(--hairline); border-radius: var(--r-m); }
.no-creation .row { flex-wrap: wrap; }
.no-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2, 8px); }
.no-notion { border: 1px solid var(--hairline); border-radius: var(--r-m); padding: var(--sp-2, 8px) var(--sp-3, 12px); display: flex; flex-direction: column; gap: 6px; }
.no-notion.is-open { border-color: var(--c-c); }
.no-notion-h { display: flex; flex-direction: column; gap: 4px; }
.no-notion-t { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.no-terme { font-size: 16px; }
.no-notion-t .chip { font-size: 12px; }
.no-alias { margin: 0; font-size: 13px; }
.no-notion-a { flex-wrap: wrap; }
.no-panneau { display: flex; flex-direction: column; gap: var(--sp-2, 8px); padding-top: var(--sp-2, 8px); border-top: 1px dashed var(--hairline); }
.no-sous { margin: 0; font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--ink); }
.no-prods, .no-resultats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.no-prod, .no-resultats li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-family: var(--sans); font-size: 13.5px; }
.no-prod .btn-del { margin-left: auto; }
.no-chip-store { font-size: 11.5px; }
.no-rattacher .row, .no-geste { flex-wrap: wrap; }
.no-rattacher .row > select { flex: 0 1 200px; }
.no-rattacher .row > input { flex: 1 1 200px; min-width: 0; }
.no-aucune { margin: 0; }
@media (max-width: 600px) {
  .no-notion { padding: var(--sp-2, 8px); }
  .no-prod .btn-del { margin-left: 0; }
}

/* ---- Étape 2 : maîtrise calculée (D5) — badge d'état, trois formes, erreurs, « pourquoi », filtres, comptes ---- */
.no-filtres { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.no-filtre.is-active { background: var(--c-surface); color: var(--c-on); border-color: var(--c-surface); }
.no-comptes { margin: 0; font-family: var(--sans); font-size: 13px; }
.no-chip-etat { font-weight: 600; }
.no-etat-inconnue { color: var(--ink-soft); }
.no-etat-validee { color: var(--c-a); }
.no-etat-eprouvee, .no-etat-maitrisee { color: var(--ok-text); }
.no-maitrise { display: flex; flex-direction: column; gap: 4px; font-family: var(--sans); font-size: 13px; }
.no-formes { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.no-forme { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.no-forme-l { font-weight: 600; }
.no-erreurs { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.no-pourquoi { margin: 0; padding-left: 18px; font-size: 12.5px; }
.no-pourquoi li { margin: 0; }
/* Le bloc « Notions » de la page Matière (D7) et la ligne/colonne du Sceau (D6) : classes posées par le lot C, stylées ici. */
.no-mat { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 8px 0 0; padding: 6px 10px; border: 1px dashed var(--hairline); border-radius: 8px; font-size: 13px; }
.no-mat-l { font-family: var(--sans); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); }
.no-mat-f { font-size: 12.5px; }
.no-mat-a { margin-left: auto; }
.no-sceau-l { font-size: 12.5px; margin: 2px 0; }
.no-sceau-c { font-family: var(--sans); font-size: 12.5px; white-space: nowrap; }

/* ---- C3 : interrogation et tuteur (P9 + P21) — séance, question, notes, écart, passage, bilan, tuteur ---- */
.no-interro { flex-wrap: wrap; gap: 6px; }
.no-tuteur-a { flex-wrap: wrap; }
.no-seance-host { display: block; }
.no-seance { display: flex; flex-direction: column; gap: var(--sp-2, 8px); padding: var(--sp-2, 8px) 0; }
.no-seance-h { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.no-seance-t { margin: 0; font-size: 17px; flex: 1 1 auto; }
.no-chrono { font-family: var(--mono, monospace); font-size: 14px; padding: 2px 8px; border: 1px solid var(--hairline); border-radius: var(--r-m); }
.no-chrono[data-depasse="oui"] { border-color: var(--c-a); color: var(--c-a); }
.no-seance-p, .no-seance-vide, .no-q-n { margin: 0; font-family: var(--sans); font-size: 13px; }
.no-q { display: flex; flex-direction: column; gap: 6px; padding: var(--sp-2, 8px) var(--sp-3, 12px); border: 1px solid var(--hairline); border-radius: var(--r-m); }
.no-q-enonce { margin: 0; font-size: 16px; }
.no-q-abstention { color: var(--ink-soft); }
.no-q-ref { margin: 0; font-family: var(--sans); font-size: 12.5px; }
.no-reponse { width: 100%; min-height: 72px; }
.no-notes { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-family: var(--sans); font-size: 13.5px; }
.no-note { display: inline-flex; align-items: center; gap: 2px; }
.no-dictee.is-on { background: var(--c-surface); color: var(--c-on); }
.no-ecart, .no-passage { display: flex; flex-direction: column; gap: 4px; padding: 6px 10px; border: 1px dashed var(--hairline); border-radius: 8px; }
.no-segs { display: flex; flex-direction: column; gap: 6px; }
.no-seg-t { margin: 0; }
.no-seg-m { margin: 0; font-family: var(--sans); font-size: 12.5px; }
.no-seg-abstention { color: var(--c-a); }
.no-seg-retires { margin: 0; font-family: var(--sans); font-size: 12px; }
.no-passage-t { margin: 0; padding-left: 10px; border-left: 3px solid var(--hairline); }
.no-passage-ref { margin: 0; font-family: var(--sans); font-size: 12.5px; }
.no-seance-nav { flex-wrap: wrap; }
.no-bilan-r { margin: 0; font-size: 15px; }
.no-bilan-faux { display: flex; flex-direction: column; gap: 6px; }
.no-tut-q { font-size: 16px; }
.no-tut-rep { display: flex; flex-direction: column; gap: 6px; }
.no-tut-reponses { margin: 0; padding-left: 18px; font-family: var(--sans); font-size: 13.5px; }
.no-tut-indice { padding: 6px 10px; border-left: 3px solid var(--c-a); }
.no-tut-indice p { margin: 0; }
.no-tut-etape { margin: 0; font-family: var(--sans); font-size: 12.5px; }
.no-tut-commentaire { margin: 0; }
@media (max-width: 600px) { .no-q { padding: var(--sp-2, 8px); } }