
:root {
  --fond: #f6f4ef; --carte: #ffffff; --texte: #1f2a26; --doux: #5d6b66; --bord: #d9d4c7;
  --principal: #2f5d50; --principal-texte: #ffffff; --accent: #e7efe9;
  --alerte-fond: #fff4dc; --alerte-bord: #e3b54a; --erreur-fond: #fde8e6; --erreur-bord: #c8473b; --danger: #b3261e;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fond: #141a18; --carte: #1d2522; --texte: #e8ede9; --doux: #a3b0aa; --bord: #34413c;
    --principal: #7fbfa8; --principal-texte: #0f1a16; --accent: #22312b;
    --alerte-fond: #3a3020; --alerte-bord: #b8902f; --erreur-fond: #3d2220; --erreur-bord: #e07a70; --danger: #f2a39b;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fond); color: var(--texte);
  font: 17px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
main { max-width: 30rem; margin: 0 auto; padding: max(1.25rem, env(safe-area-inset-top)) 1rem 3rem; }
h1 { font-size: 1.6rem; line-height: 1.25; margin: .5rem 0 1rem; }
h2 { font-size: 1.15rem; margin: 1.75rem 0 .5rem; }
p { margin: 0 0 1rem; }
a { color: var(--principal); }
.indicateurs { display: grid; gap: .75rem; margin: 0 0 1rem; }
.indicateur { margin: 0; }
.indicateur h2, .prochaine h2 { margin: 0 0 .4rem; font-size: 1.1rem; display: flex; align-items: center; gap: .5rem; }
.indicateur ul, .deja-proposes { list-style: none; margin: 0; padding: 0; }
.indicateur li { padding: .45rem 0; border-top: 1px solid var(--bord); display: flex; flex-wrap: wrap; gap: .25rem .6rem; align-items: baseline; }
.indicateur li:first-child { border-top: 0; }
.indicateur li a { font-weight: 650; min-height: 44px; display: inline-flex; align-items: center; }
.nombre { display: inline-flex; min-width: 1.8rem; justify-content: center; padding: .05rem .5rem; border-radius: 999px; background: var(--accent); color: var(--principal); font-size: .95rem; }
.raison { display: block; width: 100%; font-size: .92rem; color: var(--texte); }
.prochaine { border-left: 5px solid var(--principal); }
.prochaine .sous-titre { margin: .8rem 0 .3rem; font-weight: 650; }
.deja-proposes li { padding: .2rem 0; }
.onglets-eleve { grid-template-columns: repeat(3, 1fr); }
.periodes { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .75rem; }
.periodes a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 .8rem; border-radius: 999px; border: 1px solid var(--bord); text-decoration: none; color: var(--texte); font-size: .9rem; }
.periodes a[aria-current] { background: var(--principal); border-color: var(--principal); color: var(--principal-texte); }
.faits { margin: 0; padding-left: 1.1rem; }
.faits li { margin: .3rem 0; }
.attente { margin: .5rem 0; padding: .6rem .8rem; border: 1px dashed var(--bord); border-radius: 10px; color: var(--doux); }
.consolider { border-left: 5px solid #c2620f; }
.statut-eleve { display: inline-block; padding: .05rem .55rem; border-radius: 999px; font-size: .82rem; font-weight: 700; border: 1.5px solid transparent; }
.statut-eleve-done { background: #2e7d4f; color: #fff; }
.statut-eleve-partial { background: #b45309; color: #fff; }
.statut-eleve-todo { background: #5f6368; color: #fff; }
.statut-eleve-aucun { background: transparent; color: var(--doux); border: 1.5px dashed var(--bord); font-weight: 600; }
.declare { font-size: .8rem; color: var(--doux); }
.legende .statut-eleve { margin-right: .15rem; }
.exos-en-cours li > span { display: flex; flex-direction: column; gap: .25rem; }
.non-lus { list-style: none; padding-left: 1rem; }
.non-lus li { margin: .2rem 0; }
.sous-marque { margin: 0; font-size: .9rem; color: var(--doux); }
.marque { font-weight: 700; color: var(--principal); text-decoration: none; letter-spacing: .01em; }
.entete { display: flex; justify-content: space-between; align-items: center; min-height: 48px; margin-bottom: .5rem; }
.entete a:not(.marque) { min-height: 48px; display: inline-flex; align-items: center; }
.carte { background: var(--carte); border: 1px solid var(--bord); border-radius: 14px; padding: 1.1rem; margin: 0 0 1rem; }
.doux { color: var(--doux); font-size: .95rem; }
label { display: block; font-weight: 600; margin: 0 0 .35rem; }
input[type=email], input[type=text], input[type=search] {
  width: 100%; min-height: 52px; padding: .7rem .85rem; font: inherit; color: var(--texte);
  background: var(--carte); border: 1.5px solid var(--bord); border-radius: 10px; margin: 0 0 1rem;
}
input:focus-visible, button:focus-visible, a:focus-visible, .choix:focus-within { outline: 3px solid var(--principal); outline-offset: 2px; }
button, .bouton {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px;
  padding: .7rem 1rem; font: inherit; font-weight: 650; border-radius: 12px; border: 0; cursor: pointer;
  background: var(--principal); color: var(--principal-texte); text-decoration: none; margin: 0 0 .75rem;
}
.secondaire { background: var(--accent); color: var(--texte); border: 1.5px solid var(--bord); }
.danger { background: transparent; color: var(--danger); border: 1.5px solid currentColor; }
fieldset { border: 0; padding: 0; margin: 0 0 1rem; }
legend { font-weight: 600; margin-bottom: .35rem; padding: 0; }
.choix {
  display: flex; gap: .75rem; align-items: center; min-height: 56px; padding: .6rem .85rem; margin: 0 0 .5rem;
  border: 1.5px solid var(--bord); border-radius: 12px; background: var(--carte); font-weight: 500; cursor: pointer;
}
.choix input { width: 1.3rem; height: 1.3rem; accent-color: var(--principal); margin: 0; flex: none; }
.choix:has(input:checked) { border-color: var(--principal); background: var(--accent); }
.choix small { display: block; color: var(--doux); font-weight: 400; font-size: .85rem; }
.message { border-left: 5px solid var(--alerte-bord); background: var(--alerte-fond); border-radius: 10px; padding: .85rem 1rem; margin: 0 0 1rem; }
.message.erreur { border-color: var(--erreur-bord); background: var(--erreur-fond); }
.message.ok { border-color: var(--principal); background: var(--accent); }
.statut { display: inline-block; padding: .15rem .6rem; border-radius: 999px; background: var(--accent); font-size: .85rem; font-weight: 600; }
.lien-bas { text-align: center; margin-top: 1.25rem; }
.ligne-express { margin: .35rem 0; }
.etiquette { display: inline-block; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--principal); margin-right: .25rem; }
.prive { font-size: .8rem; font-weight: 500; color: var(--doux); text-transform: none; letter-spacing: 0; }
.consigne { margin: .2rem 0 .4rem; padding-left: .6rem; border-left: 3px solid var(--bord); color: var(--doux); font-size: .95rem; white-space: pre-line; }
.bouton.continuer { margin-bottom: 1rem; }
.rappel p { margin: .25rem 0; }
.details-seance > summary { flex-wrap: wrap; gap: .25rem; }
.exo-saisie { padding: .5rem 0 .25rem; border-top: 1px solid var(--bord); }
.exo-saisie:first-of-type { border-top: 0; }
.exo-saisie textarea { margin-bottom: .5rem; }
.entree-par-defaut { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.recherche { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: 0 0 .5rem; }
.recherche input, .recherche select { flex: 1 1 10rem; margin: 0; min-height: 48px; }
.recherche button { margin: 0; width: auto; }
.biblio-choix { margin: .75rem 0; padding-top: .75rem; border-top: 1px solid var(--bord); }
.biblio-choix .puces { margin-bottom: .75rem; }
.liste.biblio li > span { display: flex; flex-direction: column; gap: .2rem; }
.liste.biblio .themes { margin: .1rem 0; }
.doublons h2 { margin-top: 0; }
.doublons .paire { padding: .5rem 0; border-top: 1px solid var(--bord); }
.paire-actions { display: flex; flex-direction: column; gap: .4rem; }
.paire-actions form, .paire-actions button { margin: 0; }
.lien-discret { background: transparent; border: 0; color: var(--principal); text-decoration: underline; min-height: 44px; }
.version-pilote { margin: 0 0 .25rem; text-align: center; font-size: .8rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--doux); }
.lien-bas a { display: inline-flex; min-height: 48px; align-items: center; }
form.ligne { margin: 0; }
/* ---------- Pages du prof (lot 3) ---------- */
.onglets { display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem; margin: 0 0 1rem; background: var(--carte); border: 1px solid var(--bord); border-radius: 12px; padding: .25rem; }
.onglets a { display: flex; align-items: center; justify-content: center; min-height: 44px; border-radius: 9px; text-decoration: none; color: var(--texte); font-size: .9rem; font-weight: 600; }
.onglets a[aria-current=page] { background: var(--principal); color: var(--principal-texte); }
.fil { margin: 0 0 .25rem; }
.fil a { display: inline-flex; min-height: 44px; align-items: center; text-decoration: none; font-weight: 600; }
.eleves, .liste { list-style: none; padding: 0; margin: 0 0 1rem; }
.eleve { display: flex; gap: .5rem; align-items: stretch; margin: 0 0 .6rem; }
.eleve-nom { flex: 1; display: block; background: var(--carte); border: 1px solid var(--bord); border-radius: 14px; padding: .75rem 1rem; text-decoration: none; color: var(--texte); min-height: 64px; }
.eleve-nom strong { display: block; font-size: 1.1rem; }
.plus { display: flex; align-items: center; justify-content: center; min-width: 96px; border-radius: 14px; background: var(--principal); color: var(--principal-texte); font-weight: 700; text-decoration: none; padding: 0 .75rem; }
.pastille { display: inline-block; margin: .3rem .3rem 0 0; padding: .1rem .55rem; border-radius: 999px; background: var(--alerte-fond); border: 1px solid var(--alerte-bord); font-size: .8rem; font-weight: 700; color: var(--texte); vertical-align: middle; }
.pastille.grise { background: var(--accent); border-color: var(--bord); }
details.ajout, details.zone-danger { background: var(--carte); border: 1px solid var(--bord); border-radius: 14px; padding: 0 1rem; margin: 0 0 1rem; }
details.ajout > summary, details.zone-danger > summary { min-height: 52px; display: flex; align-items: center; font-weight: 650; color: var(--principal); cursor: pointer; list-style: none; }
details.zone-danger > summary { color: var(--danger); }
details[open].ajout, details[open].zone-danger { padding-bottom: .5rem; }
summary::-webkit-details-marker { display: none; }
textarea, select, input[type=date] {
  width: 100%; min-height: 52px; padding: .7rem .85rem; font: inherit; color: var(--texte);
  background: var(--carte); border: 1.5px solid var(--bord); border-radius: 10px; margin: 0 0 1rem;
}
textarea { resize: vertical; min-height: 5.5rem; }
textarea:focus-visible, select:focus-visible { outline: 3px solid var(--principal); outline-offset: 2px; }
.deux { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.puces { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.puce { display: inline-flex; margin: 0; font-weight: 500; cursor: pointer; }
.puce input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.puce span { display: inline-flex; align-items: center; min-height: 44px; padding: .4rem .9rem; border-radius: 999px; border: 1.5px solid var(--bord); background: var(--carte); }
.puce input:checked + span { background: var(--principal); border-color: var(--principal); color: var(--principal-texte); }
.puce input:checked + span::before { content: "✓ "; white-space: pre; }
.puce input:focus-visible + span { outline: 3px solid var(--principal); outline-offset: 2px; }
.form-seance fieldset > input[type=text] { margin-bottom: .5rem; }
.barre-enregistrer { position: sticky; bottom: 0; padding: .75rem 0 max(.75rem, env(safe-area-inset-bottom)); background: linear-gradient(transparent, var(--fond) 30%); }
.barre-enregistrer button { margin: 0; box-shadow: 0 2px 10px rgba(0,0,0,.15); }
.seance { background: var(--carte); border: 1px solid var(--bord); border-radius: 14px; padding: 1rem; margin: 0 0 1rem; }
.seance-tete { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 .35rem; }
.seance .pastille { margin: 0; }
.themes { margin: 0 0 .5rem; }
.theme { display: inline-block; margin: 0 .3rem .3rem 0; padding: .05rem .55rem; border-radius: 999px; background: var(--accent); font-size: .85rem; }
.bilan { white-space: pre-line; }
.exos { margin: 0 0 .75rem; padding-left: 1.4rem; }
.exos li { margin: 0 0 .6rem; }
.exo-titre { font-weight: 600; }
.retour { margin: .25rem 0; }
.retour q { font-style: italic; quotes: "« " " »"; }
.etat { display: inline-block; padding: 0 .5rem; border-radius: 6px; font-size: .8rem; font-weight: 700; background: var(--accent); }
.etat-done { background: #d8efdf; color: #1f5132; }
.etat-partial { background: #fdecd8; color: #84430a; }
.etat-todo { background: #ececec; color: #444; }
.reponse { margin: .25rem 0; padding: .4rem .6rem; border-left: 3px solid var(--principal); background: var(--accent); border-radius: 6px; font-size: .95rem; }
details.repondre > summary { min-height: 44px; display: inline-flex; align-items: center; color: var(--principal); font-weight: 600; cursor: pointer; }
details.repondre form { margin-top: .25rem; }
.seance-actions { border-top: 1px solid var(--bord); margin-top: .5rem; padding-top: .25rem; }
.petit { min-height: 44px; width: auto; padding: .4rem .9rem; font-size: .95rem; margin: .25rem 0; }
.petit-lien { display: inline-flex; min-height: 44px; align-items: center; font-weight: 600; }
.liste li { display: flex; justify-content: space-between; align-items: center; gap: .75rem; background: var(--carte); border: 1px solid var(--bord); border-radius: 12px; padding: .5rem .5rem .5rem 1rem; margin: 0 0 .5rem; }
.liste .petit { margin: 0; flex: none; }
.plein { background: var(--danger); color: #fff; border: 0; }
.sous-titre { font-size: 1rem; margin: .75rem 0 .4rem; }
.retour-eleve { margin: .4rem 0 .25rem; }
.retour-eleve .puces { margin-bottom: .5rem; }
.retour-eleve textarea { min-height: 3.5rem; margin-bottom: .25rem; }
.eleve-info { margin-top: 1.5rem; }
/* ---------- Carnet de l'élève : finitions ---------- */
details.intercalaire { padding: 0 1rem 1rem; }
details.intercalaire:not([open]) { padding-bottom: 0; }
details.intercalaire > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center;
  gap: .5rem; min-height: 56px; margin: 0 -1rem; padding: .5rem 1rem; }
details.intercalaire > summary::after { content: "▾"; color: var(--principal); font-size: 1.1rem; }
details.intercalaire:not([open]) > summary::after { content: "▸"; }
details[open].intercalaire > summary { border-bottom: 1px solid var(--bord); margin-bottom: .6rem; }
.compte { margin-left: auto; padding: .1rem .6rem; border-radius: 999px; background: var(--accent); font-size: .85rem; font-weight: 600; white-space: nowrap; }
.statuts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin: .4rem 0 .25rem; }
.statut { min-height: 56px; margin: 0; padding: .4rem .15rem; font-size: .95rem; font-weight: 700; border-radius: 12px; border: 2px solid; white-space: nowrap; letter-spacing: -.01em; }
.statut-done { background: #e3f3e8; color: #1d5b34; border-color: #2e7d4f; }
.statut-partial { background: #fdecd8; color: #84430a; border-color: #c2620f; }
.statut-todo { background: #efefef; color: #3d3d3d; border-color: #8a8a8a; }
.statut-done.actif { background: #2e7d4f; color: #fff; }
.statut-partial.actif { background: #b45309; color: #fff; border-color: #b45309; }
.statut-todo.actif { background: #5f6368; color: #fff; border-color: #5f6368; }
.statut.actif::before { content: "✓ "; white-space: pre; }
details.note-eleve > summary { min-height: 44px; display: inline-flex; align-items: center; color: var(--principal); font-weight: 600; cursor: pointer; font-size: .95rem; }
details.note-eleve textarea { min-height: 3.5rem; margin-bottom: .25rem; }
.bulle { position: relative; margin: .5rem 0 .75rem; padding: .6rem .85rem; border-radius: 14px 14px 14px 4px;
  background: #e4eefc; border: 1.5px solid #9dbcec; color: #14294d; }
.bulle p { margin: 0; white-space: pre-line; }
.bulle-auteur { display: block; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #2c5aa0; margin-bottom: .15rem; }
.merci { margin: .5rem 0 .25rem; padding: .55rem .8rem; border-radius: 12px; background: #e3f3e8; color: #1d5b34; font-weight: 650; }
.merci::before { content: "♥ "; }
@media (prefers-color-scheme: dark) {
  .statut-done { background: #183526; color: #b9e6c8; border-color: #4fae78; }
  .statut-partial { background: #3a2610; color: #f6c894; border-color: #e08a3a; }
  .statut-todo { background: #2a2a2a; color: #dcdcdc; border-color: #8a8a8a; }
  .statut-done.actif { background: #4fae78; color: #0b1f13; }
  .statut-partial.actif { background: #e08a3a; color: #2a1606; border-color: #e08a3a; }
  .statut-todo.actif { background: #9a9a9a; color: #141414; border-color: #9a9a9a; }
  .bulle { background: #1b2a42; border-color: #3f6aa8; color: #dce8fb; }
  .bulle-auteur { color: #9cc0f5; }
  .merci { background: #183526; color: #b9e6c8; }
}
.etapes { padding-left: 1.3rem; margin: 0 0 .75rem; }
.etapes li { margin: 0 0 .4rem; }
details.autre-tel > summary { min-height: 44px; display: flex; align-items: center; color: var(--principal); font-weight: 600; cursor: pointer; }
/* Déjà ouvert depuis l'icône de l'écran d'accueil : inutile de proposer de l'ajouter. */
@media (display-mode: standalone) { .ajout-ecran { display: none; } }
.lien-eleve { font-size: .95rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
[hidden] { display: none !important; }
.cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
input:disabled, textarea:disabled { opacity: .7; }
@media (prefers-color-scheme: dark) {
  .etat-done { background: #1f3b2a; color: #bfe6cc; }
  .etat-partial { background: #3d3418; color: #f3dc9b; }
  .etat-todo { background: #2c2c2c; color: #d4d4d4; }
  .plein { color: #1a0d0c; }
}
